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

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

dma_kdma_k Posts: 18Questions: 3Answers: 0
edited July 2014 in Free community support

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

This question has an accepted answers - jump to answer

Answers

  • allanallan Posts: 61,446Questions: 1Answers: 10,054 Site admin
    edited July 2014

    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_kdma_k Posts: 18Questions: 3Answers: 0

    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)?

  • allanallan Posts: 61,446Questions: 1Answers: 10,054 Site admin

    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_kdma_k Posts: 18Questions: 3Answers: 0

    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.

  • allanallan Posts: 61,446Questions: 1Answers: 10,054 Site admin
    Answer ✓

    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

  • headshot9xheadshot9x Posts: 59Questions: 16Answers: 1

    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.

  • allanallan Posts: 61,446Questions: 1Answers: 10,054 Site admin

    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

This discussion has been closed.