clarkk
clarkk

Reputation: 27689

issue with insertBefore()

I got a small object which has to append new rows to a table.. It works fine in most cases, but if there is a table inside some of the rows (in the "root" table) the object doesn't append to the proper table!?

I have been doing a bit of debugging and found the line where it all goes wrong.. If DEBUG is set and the line with insertBefore() is omitted the object appends to the proper table

var List = new function(){
    this.append_row = function(row, tbl, index){
        if(DEBUG){
            index = -1;
        }

        if(index == 0){
            row.prependTo(tbl);
        }
        else if(index > 0){
            var elm = $('tr', tbl);
            if(elm.length > index){
                row.insertBefore(elm.eq(index)); // the issue is in this line
            }
            else{
                row.appendTo(tbl);
            }
        }
        else{
            row.appendTo(tbl);
        }
    };
}

Upvotes: 1

Views: 249

Answers (1)

user113716
user113716

Reputation: 322502

It is because this:

var elm = $('tr', tbl);

...is equivalent to this:

var elm = $(tbl).find('tr');

So it will locate all nested <tr> elements in any nested <table>.

So you could do this:

var elm = $(tbl.rows); // if `tbl` is the DOM element

or this:

var elm = $(tbl[0].rows); // if `tbl` is a jQuery object

Now elm is a reference only to the rows of the tbl, and not any nested <table> elements.

Upvotes: 2

Related Questions