Question

I have some code that should remove the parent row of the clicked td and then return the id’s of the other rows to an input box. If I comment out the remove line it all works well, but with the remove call I get an error:

rows is undefined
 for (var i=0; i<rows.length; i++) { 

$("td.remove").live('click', function(event) {
    var element  = this;

    $(this).parent().remove();

    var rows  = $(element).parents('table').attr("rows");

    answer = '';                       
    for (var i=0; i<rows.length; i++) {
        answer += rows[i].id+",";
    }

    $('#' + $(this).parents('table').attr("title")).val(answer);

});

How can I get the remaining rows after I have deleted the row I clicked on?

Answer 1

If you remove the parent element, its descendent elements will not exist.

You’ll need to refactor your code so you have a reference to the outer table without relying on deleted elements.