By using this site, you agree to our updated Privacy Policy and our Terms of Use. Manage your Cookies Settings.
459,461 Members | 1,002 Online
Bytes IT Community
+ Ask a Question
Need help? Post your question and get tips & solutions from a community of 459,461 IT Pros & Developers. It's quick & easy.

Adding the Row dynamically to the table

P: 31
Hello,

I am adding a row dynamically to the table ,

Expand|Select|Wrap|Line Numbers
  1. var table = document.getElementById('example');
  2. var rowCount  = table.rows.length;
  3. var row = table.insertRow(rowCount);
now i want to set attributes to the new row added such as id, class etc

How can i do that.

Please help

Thanks in advance
Dec 28 '09 #1
Share this Question
Share on Google+
2 Replies


RamananKalirajan
100+
P: 607
Hi...
This will help you out

Expand|Select|Wrap|Line Numbers
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <!-- Its important to define the DocType for HTML -->
  2. <html xmlns="http://www.w3.org/1999/xhtml">
  3. <head>
  4. <script type="text/javascript">
  5. var counter=0;
  6. function doThis()
  7. {
  8.    var tempId = "Count"+counter;
  9.    var x = document.getElementById('myText').value
  10.    var xx= "<input type='text' value='"+x+"' id='"+tempId+"' onclick='alert(this.parentNode.parentNode.id)'>";
  11.    var row=document.getElementById('myTable').rows.length; 
  12.    var y=document.getElementById('myTable').insertRow(row)  ;
  13.    y.id="rowId"+row;
  14.    counter++;
  15.    var b=y.insertCell(0);
  16.    b.innerHTML=xx; 
  17.  
  18. }
  19. </script>
  20. </head>
  21. <body>
  22. <input type="text" id="myText">
  23. <br/>
  24. <input type="button" value="Add" onclick="doThis()">
  25. <br/>
  26. <table id="myTable" border="1" cellspacing="5" cellpadding="5">
  27. <tr>
  28. <th>Name</th>
  29. </tr>
  30. </table>  
  31. </body>
  32. </html>
Thanks and Regards
Ramanan Kalirajan
Dec 28 '09 #2

acoder
Expert Mod 15k+
P: 16,027
You can use elem.id and elem.className as shown in RK's code, or use setAttribute().
Dec 30 '09 #3

Post your reply

Sign in to post your reply or Sign up for a free account.