API rows() returns indexes, but I would expect "row" API objects

dma_k

Suppose I would like to iterate all rows and apply some logic for each row data:

var matchedRow = null;

myDataTable.rows().each(function(row) {
    // Here I would expect that "row" is API object
    if (row.data().someField === 10) { // I get "not such method data()" here
        matchedRow = row;
        ... do something ...
        return false;
    }
});

if (matchedRow) matchedRow.invalidate().draw();

however in given code snippet the variable row has value something like [11, 8, 5, 4, ...], which I would expect to be a result for rows().indexes().each() call. What I want can be implemented like this (ugly):

var len = myDataTable.rows().indexes().length;

for (var i = 0; i < len; i++) {
    var row = myDataTable.row(i);
    if (row.data().someField === 10) {
        matchedRow = row;
        return false;
    }
}

How to do it more nicely?

DataTables v1.10.1

allan

You would do something like this:

myDataTable.rows().eq(0).each( function ( row ) {
   var data = myDataTable.row( row ).data();

  ...
} );

The selector methods (rows(), columns(), cells() and their singular counterparts really just build an array of indexes - which you are seeing here.

Note also that I've use eq() to get the first element of the rows() return only. This is required because the API is multi-table aware - so is looks like a 2D array with the outer array for the tables.

Allan

dma_k

Thanks. I see that it still iterates over the indexes. Would it be nice to add opportunity to iterate rows directly (and perhaps faster then lookup row by index each time)?

allan

Agreed. I'm not sure how much of a performance improvement it would yield (likely only really a few less function calls, since the row index look up is quite fast), but it would certainly help and make the code nicer. I'll look into this. Thanks!

Allan

dma_k

I wonder if myDataTable.rows().each(function(row) {...}) construction is possible in recent DataTable versions? And what would be also cool is to enable construction like this myDataTable.rows().filter(function(row) {...}).invalidate().draw(false);

Thanks.

allan

The rows().every() method that was introduced in the recent 1.10.6 release adds this ability :-).

For the filter, you can use the row-selector as a function which would basically provide that ability.

Allan

headshot9x

Dear allan. I have same problem . I can not get data at row selected in DatatTable.

<table id="example" class="display">
            <thead>
                <tr>
                    <td>No</td>
                    <th>LOCATION_ID</th>
                    <th>AREA_ID</th>
                    <th>LOCATION_NAME</th>
                    <th>DES</th>
                    <th>DATE</th>
                    <th>BY</th>
                    <th>FLAG</th>
                </tr>
            </thead>
        </table>

And my script

  "aoColumns": [   /// eight columns set with columns of table
                    { "mData": null },
                    { "mData": "LOCATION_ID" },
                    { "mData": "AREA_ID" },
                    { "mData": "LOCATION_NAME" },
                    { "mData": "LOCATION_DES" },
                    { "mData": "EDIT_DATE" },
                    { "mData": "EDIT_BY" },
                    { "mData": "FLAG" }
                ],             
                "columnDefs": [{   // define  first column , is column zero 
                    "searchable": false,
                    "orderable": false,
                    "targets": 0
                }],              
                "order": [[3, 'asc']]   /// sort at column three
            });
            table.on('order.dt search.dt', function () {
                table.column(0, { search: 'applied', order: 'applied' }).nodes().each(function (cell, i) {
                    cell.innerHTML = i + 1;
                });
            }).draw();
            table.column([1,2,5,6,7]).visible(false);
            $('#example tbody').on('click', 'tr', function () {
                $(this).toggleClass('selected');
                var data = table.row($(this)).data();
                alert(data[1] + "  " + data[2]);
            });

And then run it , i can not get data in row , It show error "undefined and undefined" . Can you give me some advice . Thank you.

allan

You are accessing the data as an array (data[1]), but you are configuring DataTables to use objects...

The data is not an array in your situation here, it is an object. Use data.LOCATION_ID for example.

Allan