jaymc Posted October 8, 2007 Share Posted October 8, 2007 Im trying to use javascript to delete table rows This works len = tab.rows.length; tab.deleteRow(len-1); However, it will only delete the last row of the table You can tell it to delete a row by its occurance in the table, for instance len = tab.rows.length; tab.deleteRow(3); That will delete row 3. However, once you have deleted a row, row 5 becomes row 4, rows 4 becomes row 3 etc etc, therefor telling it which specific row to delete wont work I need a way to delete a <TR> row by its ID this must work in firefox Thanks Quote Link to comment Share on other sites More sharing options...
fenway Posted October 9, 2007 Share Posted October 9, 2007 You should be able to look up the id in the DOM and delete it. Quote Link to comment Share on other sites More sharing options...
jaymc Posted October 9, 2007 Author Share Posted October 9, 2007 Any exaples, Im not as good as I'd like to be with javascript, only event handlers etc Quote Link to comment Share on other sites More sharing options...
fenway Posted October 9, 2007 Share Posted October 9, 2007 document.getElementById() to find it... then settting the display attribute to "none" should work well enough. Quote Link to comment Share on other sites More sharing options...
jaymc Posted October 10, 2007 Author Share Posted October 10, 2007 Yeh I was using that originally but the problem is there is a white space where that row has been hidden For example row 1 row 2 row 3 row 4 javascript = hide 2 row 1 row 3 row 4 What I need is this row 1 row 3 row 4 Quote Link to comment Share on other sites More sharing options...
fenway Posted October 10, 2007 Share Posted October 10, 2007 I've done this many times before, I don't get whitespace that doesn't collapse... Quote Link to comment Share on other sites More sharing options...
emehrkay Posted October 10, 2007 Share Posted October 10, 2007 quick example. you can clean it up by removing the click events from the links etc <!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"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>Untitled Document</title> <script> function removeRow(row){ var r = document.getElementById('row:' + row); r.parentNode.removeChild(r); } </script> </head> <body> <table border="1" cellspacing="0" id="test_table"> <tr id="row:0"> <td> </td> <td> </td> <td><a href="#" id="del:0" onclick="removeRow(0);">del 0</a></td> </tr> <tr id="row:1"> <td> </td> <td> </td> <td><a href="#" id="del:1" onclick="removeRow(1);">del 1</a></td> </tr> <tr id="row:2"> <td> </td> <td> </td> <td><a href="#" id="del:2" onclick="removeRow(2);">del 2</a></td> </tr> <tr id="row:3"> <td> </td> <td> </td> <td><a href="#" id="del:3" onclick="removeRow(3);">del 3</a></td> </tr> </table> </body> </html> Quote Link to comment Share on other sites More sharing options...
Recommended Posts
Join the conversation
You can post now and register later. If you have an account, sign in now to post with your account.