Results 1 to 2 of 2

Thread: Dynamically Duplicating Table Row

  1. #1
    Join Date
    Jun 2010
    Posts
    14
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default Dynamically Duplicating Table Row

    Hi

    I have create a table with 1 row and when the user clicks the "Add Row" button, the row is added to the bottom of the table.

    I just can't figure out how to do it.

    Attached attempt at coding it

    Thank you.

  2. #2
    Join Date
    Dec 2008
    Location
    Portsmouth, UK
    Posts
    1,891
    Thanks
    2
    Thanked 441 Times in 435 Posts

    Default

    Code:
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
        "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    
    <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
    
    <head>
      <title></title>
    <script type="text/javascript">
    
    function AddRow(obj){
     var tr,tbdy;
     while (obj.parentNode&&!tr){
      if (obj.nodeName.toUpperCase()=='TR'){
       break;
      }
      obj=obj.parentNode;
     }
     obj.parentNode.appendChild(obj.cloneNode(true));
    }
    
    </script>
    
    </head>
    
    <body>
    <table border="1">
      <tbody>
       <tr>
        <td><input type="button" name="" value="New Row" onmouseup="AddRow(this);"/></td>
       </tr>
      </tbody>
    </table>
    
    
    </body>
    
    </html>
    Vic
    God Loves You and will never love you less.
    http://www.vicsjavascripts.org/Home.htm
    If my post has been useful please donate to http://www.operationsmile.org.uk/

Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •