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

Dynamic Table Creation Not working

P: 2
Hi,

The following code for dynamic table creation is not working.
Can anyone please help me.
The dynamically created rows and columns are not getting populated.

CODE:
=========

[HTML]<html>
<head>
<title>Sample code - Traversing an HTML Table with JavaScript and DOM Interfaces</title>
<script>
[/HTML]
Expand|Select|Wrap|Line Numbers
  1.     function startLoad() {
  2.         var tbl = document.getElementById("tbl");
  3.       var tblBody = document.getElementById("tblBody");
  4.     var newTblBody = document.createElement("newTblBody");
  5.     newTblBody.id = "tblBody";
  6.  
  7.         for (var j = 0; j < 2; j++) {
  8.             // creates a table row
  9.             var row = document.createElement("tr");
  10.  
  11.             for (var i = 0; i < 2; i++) {
  12.                 // Create a <td> element and a text node, make the text
  13.                 // node the contents of the <td>, and put the <td> at
  14.                 // the end of the table row
  15.                 var cell = document.createElement("td");
  16.                 var cellText = document.createTextNode("cell is row " + j + ", column " + i);
  17.                 cell.appendChild(cellText);
  18.                 row.appendChild(cell);
  19.             }
  20.  
  21.             // add the row to the end of the table body
  22.             newTblBody.appendChild(row);
  23.         }
  24.  
  25.         // put the <tbody> in the <table>
  26.         tbl.replaceChild(newTblBody, tblBody);
  27.         // sets the border attribute of tbl to 2;
  28.         tbl.setAttribute("border", "2");
  29.     }
[HTML]</script>
</head>

<body onload="startLoad()">
<table id="tbl" border="1" width="100%" cellspacing="0">
<thead>
<tr>
<td class="header">Col 1</td>
<td class="header">Col 2</td>
</tr>
</thead>

<tbody id="tblBody">
</tbody>
</table>
</body>

</html>[/HTML]

===========================
Sep 26 '07 #1
Share this Question
Share on Google+
3 Replies


dmjpro
100+
P: 2,476
Welcome to TSDN!
Use Code Tags, read Posting Guidelines before Post.

Expand|Select|Wrap|Line Numbers
  1. //var newTblBody = document.createElement("newTblBody");
  2. //it is wrong, the right one is given below
  3. var newTblBody = document.createElement("TBODY");
  4.  
Kind regards,
Dmjpro.
Sep 26 '07 #2

P: 2
Hi Dmjpro,

Thanks a lot for your help. It works. Great.
Sorry that I haven't included the code tag.

Thanks and Regards,
Arunan

Welcome to TSDN!
Use Code Tags, read Posting Guidelines before Post.

Expand|Select|Wrap|Line Numbers
  1. //var newTblBody = document.createElement("newTblBody");
  2. //it is wrong, the right one is given below
  3. var newTblBody = document.createElement("TBODY");
  4.  
Kind regards,
Dmjpro.
Sep 26 '07 #3

acoder
Expert Mod 15k+
P: 16,027
Removed "please help" from the thread title.
Sep 26 '07 #4

Post your reply

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