CODEWITHSUNDEEP
javascriptjquery
keewee279
keewee279

Reputation: 1654

How to get TD from next row with same index as current TD

I have a large HTML table where all rows of the body have the same structure.

Within this table there are editable TDs (which have the class "editable" and contain a contenteditable div) and non-editable TDs (which dont't have the class "editable" and do not contain a div).

Now I am trying to get the TD from the next row that has the same index as the current (closest) TD.

The below code gives me the correct index of my current TD within its row (and looking only at editable TDs).

Can someone tell me how I can get the equivalent TD of the next row ?

My jQuery: 

$(document).keydown(function(e) {
    var current = $(e.target);
    var editables = $(current).closest('tr').find('td.editable');
    var count = editables.length;
    alert( editables.index($(current).closest('td')) ); // for testing
    // ...
});

Instead of the alert I am looking for something like the following: 

$(current).closest('tr').next('tr').find( /* the td with class editable AND the index matching the above */ );

Example:
If I am currently on the 4th editable TD in a row I would then need the 4th editable TD in the next row.

Upvotes: 3

Views: 637

Answers (1)

AmmarCSE
AmmarCSE

Reputation: 30557

Try using :eq() like

$(document).keydown(function(e){
    var current = $(e.target);
    var editables = current.closest('tr').find('td.editable');
    var count = editables.length;
    var index = editables.index(current.closest('td')); 
    current.closest('tr').next('tr').find('td:eq('+index+')');
});

As commented above, you can use current instead of $(current)

Upvotes: 5

Related Questions