Datatables. How to loop through all rows and get id of each tr entry

Question

This questions targets to Datatables plug-in for JQuery.

I need to loop through all table rows (even paginated) and get id of each tr element.

HTML table like this:

<table>
  <thead>
    <tr>
      <th>Header content 1</th>
      <th>Header content 2</th>
    </tr>
  </thead>
  <tbody>
    <tr id="etc_1_en">
      <td>Etc 1</td>
      <td>Etc 2</td>
    </tr>
    <tr id="etc_1_ru">
      <td>Etc 3</td>
      <td>Etc 4</td>
    </tr>   
    <tr id="etc_1_fr">
      <td>Etc 5</td>
      <td>Etc 6</td>
    </tr>   
    <tr id="etc_2_en">
      <td>Foo 1</td>
      <td>Foo 2</td>
    </tr>
    <tr id="etc_2_ru">
      <td>Foo 3</td>
      <td>Foo 4</td>
    </tr>   
    <tr id="etc_2_fr">
      <td>Foo 5</td>
      <td>Foo 6</td>
    </tr>       
  </tbody>
</table>

So I need to loop through each row and hide row if last 2 characters is not equal to en (with this checking everything fine, I'm using substr).

I can loop through all rows in following:

tbl = $('#myTable').DataTable();
var data = tbl.rows().data();

data.each(function (value, index) {
    console.log('Data in index: ' + index + ' is: ' + value);
});

But I can't find a way to get id of tr (with this sample data etc_1_en, etc_1_ru and so on). Could someone help me?

I've tried to pass in function id as parameter, but it returns - undefined.

Solution

You can loop through the rows() using rows().every(). This way you will have access to the row object, which will give you both data and id.

tbl = $('#myTable').DataTable();

tbl.rows().every(function () {
  var data = this.data();
  var id = this.id();
  console.log('Data in id: ' + id + ' index: ' + index + ' is: ' + data);
});

More info: https://datatables.net/reference/api/rows().every()

Comments

[Infinity]

Thanks for an answer, but I get an error: row.data is not a function

[spawnedc]

Sorry, I missed that part. I updated the answer. Basically, the row object doesn't work as I expected. You can do tbl.row(index).data() instead to get the data.

[Infinity]

Yea, I've figured it out by adding inside loop var row = tbl.row();, but in this case I got printed info only about 1 row. I've tried to use your updated answer - the same, only 1 log printed to console. Also as I think there row(index) should be added in var id too, also value should be removed from console log. But main problem that this not loop through all rows, only first one.

[spawnedc]

Updated the answer. Basically, there's rows().every() method, which allows you to loop through every row and you can access the row object using this.

[Infinity]

Thank your code before editing helped me, I achieved it without every.

[Infinity]

I have another question related to this one, maybe you could assist me? stackoverflow.com/questions/49151693/…

[spawnedc]

I added my answer to that one.