Question

I have a little problem. I have some dynamically created tables and each row has an id. I want to delete the row with the id “x”.

I tried the usual method (removeChild) but it doesn’t work for tables apparently.

function deleteRow(tableid, rowid)  
{   
      document.getElementById(tableid).removeChild(document.getElementById(rowid));  
}   

The error I get is: Node was not found” code: “8

I also tried this:

function deleteRow(tbodyid, rowid)   
{  
      document.getElementById(tbodyid).removeChild(document.getElementById(rowid));   
}   

and got the same error.

I can’t use the deleteRow() method because that one needs the index of the row and I prefer not to search for the id mark the index then delete (even though if I don’t find other solutions…).

Answer 1

How about:

function deleteRow(rowid)  
{   
    var row = document.getElementById(rowid);
    row.parentNode.removeChild(row);
}

And, if that fails, this should really work:

function deleteRow(rowid)  
{   
    var row = document.getElementById(rowid);
    var table = row.parentNode;
    while ( table && table.tagName != 'TABLE' )
        table = table.parentNode;
    if ( !table )
        return;
    table.deleteRow(row.rowIndex);
}