CODEWITHSUNDEEP
jqueryhtml-table
boss
boss

Reputation: 1606

How to find rowindex when clicked a button in table

I want to find row which clicked button in.

<table>
  <tr>
    <td>foo 1</td>
    <td><input  type="button" value="Remove" id="remove1"/> </td>
  </tr>
  <tr>
    <td>foo 2 </td>
    <td><input  type="button" value="Remove" id="remove2"/> </td>
  </tr>
</table>

My table struct is like above. Normally I can us buttonid to get row index. But If I remove a row (tr) another row index changes. For example:

If I remove first row with jQuery, second row index changes as 0 then I cannot use button's id. (remove - 2 )

Well I think that I must use parent function but it doesn't work.

var elem = $('#remove2');
alert(elem.parent()[0].sectionRowIndex);

I tried this one but doesn't work. I need row index that clicked button in the row.

I hope that I explained my issue.

Upvotes: 11

Views: 55288

Answers (4)

Roko C. Buljan
Roko C. Buljan

Reputation: 206618

You don't need ID

$('table').on('click', 'input[value="Remove"]', function(){
  $(this).closest('tr').remove();
});

Upvotes: 2

Mahendra Waykos
Mahendra Waykos

Reputation: 677

IF you are adding row dynamically you can 

 $(document).on('click', 'button', function () {
     var indexRow = this.parentNode.parentNode.rowIndex;
     document.getElementById("table-name").deleteRow(indexRow);
 });

Upvotes: 2

palaѕн
palaѕн

Reputation: 73966

Try this:

$("table tr input").on('click', function(e){
   alert($(this).closest('td').parent()[0].sectionRowIndex);
});​

FIDDLE

Upvotes: 25

Jai
Jai

Reputation: 74738

Try using this: http://jsfiddle.net/jd9N4/1/

var elem = $('input[type="button"]');
$(elem).click(function() {
   alert($(this).closest('tr').index());
   $(this).closest('tr').remove();
});

Upvotes: 6

Related Questions