Automatic select of the first row on reload

OzPenguin

I have a table that populates with default data at first, and then if a user changes the search criteria, it goes back to the database via an ajax call and reloads the table's data.

I can get the table to automatically select the first row after the initial load by using fnInitComplete callback shown the following code in the creation of the data table

    $('#ProductList').DataTable( {
        ...
        "fnInitComplete": function(oSettings, json) { $('#ProductList tbody tr:eq(0)').click(); }
    });

However, after the user updates the search criteria, I repopulate the table with the following code
and the .ajax.reload() does not cause the table to re-initialise, so I don't get the first row selected again.

    table = $("#ProductList").DataTable();
    table.clear();
    table.draw();
    table.ajax.reload();    

How can I capture the event at the end of the of the .ajax.reload() ?

allan

Two options:

1. ajax.reload() accepts a callback function as the first argument, so you can do basically the same as your initComplete function there.
2. Listen for draw using one() to execute a function when the table next redraws.

Allan

OzPenguin

Allan

option #1 worked beautifully for me

    table.ajax.reload( function (json) {
        $('#ProductList tbody tr:eq(0)').click();
    } );

thanks heaps