Click here to Skip to main content
14,865,088 members
Please Sign up or sign in to vote.
0.00/5 (No votes)
See more:
var t="<table id='datatable'>";
        t+=" <tbody><tr><td>head1</td><td> head </td><td> head 1</td></tr>";
        t+="<tr><td>value from db</tr></td>";
        t+=" </tbody></table>";
        document.getElementById('invitee').innerHTML=t;//div tag

Above is my code to create a dynamic table by getting data from database

On clicking a button i need to add a new row to the above table
function addRow() {
            var table = document.getElementById('dataTable');
            var rowCount = table.rows.length;
            var row = table.insertRow(rowCount);
            var cell2 = row.insertCell(0);
            cell2.innerHTML = "SDGF";
            var cell3 = row.insertCell(1 );
            var element2 = document.createElement("input");
            element2.type = "button";
   = "delete";

this is the method to add a row.
this method works fine while creating a static table in html but not for the above one.I am getting an error
"Uncaught TypeError: Cannot read property 'rows' of null "
Anybody please help me solve this issue.
Updated 11-Jan-15 23:28pm

1 solution

Do you know getElementById is case sensitive?
change from
var table = document.getElementById('dataTable');
var table = document.getElementById('datatable');
p@y@l 12-Jan-15 6:09am
So silly i dint notice that...Thanks a lot.. :)
CPallini 12-Jan-15 6:22am
You are welcome.

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)

CodeProject, 20 Bay Street, 11th Floor Toronto, Ontario, Canada M5J 2N8 +1 (416) 849-8900