How to refresh data in form after reloading datatable

a3pl

Hi

in my project i use datatable with data from SQL database to navigate through records update/create/delete them.
After selecting each row in datatable, detrails from record described there, are written to html form next to the table.
All is working great but i have a problem with one thing.
Im using bootstrap and I call a modal window with a button to edit data selected in a row.
After editing and updating/deletiing data i reload the datatable but i have a problem with a form with data details (based on id from a datatable row).
The details are not refreshing.

I tried to ad a function to drawCallback or on.draw method but it looks like the row isnt selected yet in that moment.

For example:
dataTable.on( 'draw', function () {
console.log( 'Is row selected yet ?: '+ dataTable.rows( '.selected' ).any() );
} );
I always get "false" result, although I see selected row in table.

I really need to refresh data in form after updateing details in modal.

I hope its simple but i couldnt find an answer.

colin

Hi @a3pl ,

Are you using Editor for the editing, or your own implementation? We're happy to take a look, but it would help, as per the forum rules, if you could link to a running test case showing the issue so we can offer some help. Information on how to create a test case (if you aren't able to link to the page you are working on) is available here.

Cheers,

Colin

a3pl

Its hard to create example cause im getting data into table from SQL database.
I need to refresh form with data from selected datatable row after ajax.reload..
It looks like, when function on.draw is executed, no rows is yet selected.
I tried to do something like this:

dataTable.on( 'draw', function () {
console.log( 'Sekected row after 1 s '+ dataTable.rows( '.selected' ).any() +' - ' +dataTable.row( { selected: true } ).data());
setTimeout(function(){
console.log( 'Sekected row after 1 s: '+ dataTable.rows( '.selected' ).any() +' - ' +dataTable.row( { selected: true } ).data());
}, 1000);

The result was:
Selected after redraw: false - undefined
Sekected row after 1 s: true - <data from selected row>

I just need to get data from selected row after datatable reload.

Ok, after some time i managed to make some example showing that problem.

http://live.datatables.net/sifimuro/1/edit?html,js,console,output

Just select any row and click on refresh.
Yoi will notice that just after redraw, selected row is undefined.

} );

kthorngren

Great test case, thanks!

It looks like, when function on.draw is executed, no rows is yet selected.

Yes, the row is selected after the event draw event. I suggest trying the select event to get the data after reload. Using a boolean variable you should be able to get the selected data after reload but not if the row is user selected.

See the updated example:
http://live.datatables.net/kavazebu/1/edit

Also you will notice the order of events in the console.

Kevin

a3pl

Thank You.
After adding proper functions to select event in my app everything is working fine now.