Keep selected cell after refresh | Keep selected cell after ajax reload

aungkohein

Hi Allan & All,

My table is on automatic ajax reload every 3 seconds. Selected cell border disappeared though broswer did save it's location. When I use my arrow keys, it got activated to navigation again. But it will disappear again every 3 seconds.

I turn off the state saving for a reason. I would like to keep (show) the selected cell (only the cell selected; not filter or page) showing after ajax reload.

What is the syntax I could add to the refreshTable() function?

File: js/table.YourTableName.js

var table = $('#cargoes_lr2').DataTable( {

table.keys.enable();

var timer;

function refreshTable(){
    timer = setInterval( function(){
        table.ajax.reload( null, false ); // user paging is not reset on reload
    }, 3000 );

};

-- end --

Thank you!

colin

Hi @aungkohein ,

I made this from this example - the example was for rows so I changed it to use cells. Hope that does the trick for you,

Cheers,

Colin

aungkohein

Hi @colin ,

Thanks for the help!

It does not work. When I add this: "dataSrc": "" the result does not show. If I remove "dataSrc": "" , the blinking selected cell continues every 3 seconds.

It also caused another problem which the row cannot be selected now. I have a checkbox (on my 1st column) for each row to be selected to delete.

colin

Hi @aungkohein ,

We're happy to take a look, but it would really help if you could link to a test case. 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

aungkohein

Hi @colin,

Thanks for the help! I managed to get this from @allan.

function refreshTable(){

    var selected = table.cell({focused: true}).index();
     timer = setInterval( function(){
         table.ajax.reload( function () {

          table.cell( selected ).focus();

        }, false ); // user paging is not reset on reload
     }, 3000 ); 

};

Thanks to both of you!

Cheers.

aungkohein

//the above code has a bug. Have been rectified below.

var timer;

function refreshTable(){

     timer = setInterval( function(){

         var selected = table.cell({focused: true}).index();

         table.ajax.reload( function () {

            table.cell( selected ).focus();

        }, false ); // user paging is not reset on reload
     }, 3000 ); 
};