jQuery - Finding the row number of the current select element within its change handler

Question

I have a table. In this table have select element. How can I find in which table row is select element, from within the select's event handler:

$('#selectElemID').live('change', function(){...});

Thanks

Answer 1

EDIT (two years later): Please don't do it the way I previously described, it is a total waste as table rows already have a rowIndex property, so there's just no need to compute anything:

$('#selectElemID').live("change", function (){
    alert($(this).closest("tr")[0].rowIndex);
});

Demo.

<silliness>

This should do it, if you want the row number of the current select element (which is what I understand from the question):

$('#selectElemID').live('change', function(){
    alert($(this).closest("tr").prevAll("tr").length + 1);
});

To explain:

$(this).closest("tr")

means select the closest parent tr of this select element.

.prevAll("tr").length + 1

means select all the previous rows, and get me the length of the returned collection. Increment it by one to get the current row number, because we are at total previous rows + 1.

For more information:

• http://api.jquery.com/prevAll/
• http://api.jquery.com/closest/

</silliness>

Answer 2

also:

$('#selectElemID').live('change', function(){
    alert($(this).closest("tr")[0].rowIndex);
});