Forum Moderators: open

Message Too Old, No Replies

how to delete added rows?

         

PHPycho

9:34 am on Apr 6, 2007 (gmt 0)

10+ Year Member



Hello forums!
I had used the following javascript code for adding rows
Javascript:
function addRow(row)
{
table = row.parentNode.parentNode;
pos = row.rowIndex;

// Row for file
k = 0;
row = table.insertRow(pos);
cell = row.insertCell(k++);
//cell.setAttribute('align','right');
cell.innerHTML = 'File Upload';
cell = row.insertCell(k++);
cell.innerHTML = '<input type="text" name="title[]" class="text" />';
}

for event handling
HTML:
<input class="text" type="button" name="add" value="add more &raquo;" onclick="addRow(this.parentNode.parentNode)" />

I want to make some change with the function.
I want to add a function that deletes the row created by js
how to perform such?
Please help me. Any help and suggestions will be highly appreciated.
Thank you

Dabrowski

10:36 am on Apr 6, 2007 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



Use the table.deleteRow method, table.deleteRow( rowNumber);

A couple of pointers on your function though, you should use document.getElementsById for your table, it's more reliable. If the INPUT was suddenly nested in something else, say a DIV for some reason, it would break your code.

You could also use this method:


function addRow( evt) {
var e = evt ¦¦ event;
var obj = e.target ¦¦ e.srcElement;

and take this.parentNode.parentNode out of your onClick parameter on the INPUT tag. obj then becomes your INPUT box.

Then to find the table have


var table = obj.parentNode;
while( table.tagName!= "TABLE") table = table.parentNode;

Something like that.

Anyway, deleteRow is the function you were after.