fnDisplayRow

Shift the table's paging to display a given tr element

This plug-in will take a tr element and alter the table's paging to make that tr element (i.e. that row) visible.

Plug-in code

jQuery.fn.dataTableExt.oApi.fnDisplayRow = function ( oSettings, nRow )
{
    // Account for the "display" all case - row is already displayed
    if ( oSettings._iDisplayLength == -1 )
    {
        return;
    }

    // Find the node in the table
    var iPos = -1;
    for( var i=0, iLen=oSettings.aiDisplay.length ; i<iLen ; i++ )
    {
        if( oSettings.aoData[ oSettings.aiDisplay[i] ].nTr == nRow )
        {
            iPos = i;
            break;
        }
    }

    // Alter the start point of the paging display
    if( iPos >= 0 )
    {
        oSettings._iDisplayStart = ( Math.floor(i / oSettings._iDisplayLength) ) * oSettings._iDisplayLength;
        if ( this.oApi._fnCalculateEnd ) {
            this.oApi._fnCalculateEnd( oSettings );
        }
    }

    this.oApi._fnDraw( oSettings );
};

CDN

This plug-in is available on the DataTables CDN:

JS

Note that if you are using multiple plug-ins, it is beneficial in terms of performance to combine the plug-ins into a single file and host it on your own server, rather than making multiple requests to the DataTables CDN.

Version control

If you have any ideas for how this plug-in can be improved, or spot anything that is in error, it is available on GitHub and pull requests are very welcome!

Example

// Display the 21st row in the table
  var table = $('#example').dataTable();
  table.fnDisplayRow( table.fnGetNodes()[20] );