How do I get current rowindex of a table using Javascript?

Question

Can I get current row index of a table in Javascript and can we remove the row of table with current Index that we got?

Answer 1

The rowIndex property returns the position of a row in table

function myFunction(x) {
  console.log("Row index is: " + x.rowIndex);
}

<table>
  <tr onclick="myFunction(this)">
    <td>Click to show rowIndex</td>
  </tr>
  <tr onclick="myFunction(this)">
    <td>Click to show rowIndex</td>
  </tr>
  <tr onclick="myFunction(this)">
    <td>Click to show rowIndex</td>
  </tr>
  <tr onclick="myFunction(this)">
    <td>Click to show rowIndex</td>
  </tr>
</table>

Answer 2

By default the event object will contain the rowindex property

function myFunction() {
  var x = document.getElementsByTagName("tr");
  var txt = "";
  var i;
  for (i = 0; i < x.length; i++) {
    txt = txt + "The index of Row " + (i + 1) + " is: " + x[i].rowIndex + "<br>";
  }
  document.getElementById("demo").innerHTML = txt;
}

<table>
  <tr onclick="myFunction(this)">
    <td>Click to show rowIndex</td>
  </tr>
  <tr onclick="myFunction(this)">
    <td>Click to show rowIndex</td>
  </tr>
  <tr onclick="myFunction(this)">
    <td>Click to show rowIndex</td>
  </tr>
</table>

Answer 3

If you are using JQuery, use method .index()

var index = $('table tr').index(tr);

If no JQuery used, you can loop through all the TR element to find the matched TR.

var index = -1;
var rows = document.getElementById("yourTable").rows;
for (var i=0;i<rows.length; i++){
    if ( rows[i] == YOUR_TR ){
        index = i;
        break;
    }
}