javascript - jquery datatable retain row highlight after reload -


i reloading datatable on 10 second intervals. when user clicks on row, row highlight. when datatable reloads, highlight gone.

here shortened code datable:

$(document).ready(function()  {   // set datatable   $('#example1').datatable({             "ajax": {       "url": "api/process.php",       "type": "post",       "datasrc": ''     },     "columns": [       { "data": "" },       { "data": "column1" },       { "data": "column2" },       { "data": "column3" }     ],     "idisplaylength": 25,     "order": [[ 6, "desc" ]],     "scrolly": 600,     "scrollx": true,     "bdestroy": true,     "statesave": true   });    // reload datatable every 30 seconds   setinterval(function()   {     var table = $('#example1').datatable();     table.ajax.reload();   }, 30000);    // highlight row   $('#example1 tbody').on('click', 'tr', function()   {     $('#example1 tbody > tr').removeclass('selected');     $(this).addclass('selected');   }); }); 

all of above works how it's supposed work. need retain row highlight after datatable reloads.

please , thank in advance.

also...

i attempted answer post: jquery datatable highlight drops off after reload

but scrapped row no longer highlights.

kindly update js file below changes. below code save row clicked in global parameter , focus clicked row after ajax call.

var gblindex = 0; //this save row clicked index  function setfocus(){  $($('#example1 tbody > tr')[gblindex]).addclass('selected');    }   $(document).ready(function()  {   // set datatable   $('#example1').datatable({             "ajax": {       "url": "api/process.php",       "type": "post",       "datasrc": ''     },     "columns": [       { "data": "" },       { "data": "column1" },       { "data": "column2" },       { "data": "column3" }     ],     "idisplaylength": 25,     "order": [[ 6, "desc" ]],     "scrolly": 600,     "scrollx": true,     "bdestroy": true,     "statesave": true   });    // reload datatable every 30 seconds   setinterval(function()   {     var table = $('#example1').datatable();     table.ajax.reload();     setfocus(); // set focus/highlight row   }, 30000);    // highlight row   $('#example1 tbody').on('click', 'tr', function()   {     $('#example1 tbody > tr').removeclass('selected');     $(this).addclass('selected');     gblindex = $(this).index(); // save index clicked   }); }); 

Comments

Popular posts from this blog

python Tkinter Capturing keyboard events save as one single string -

android - InAppBilling registering BroadcastReceiver in AndroidManifest -

javascript - Z-index in d3.js -