javascript - tablesorter (mottie fork) / restore tbody scroll pos - properly? -

i search better or official way restore scroll position of tbody table content.

tablesorter 2.26.6
jquery 2.2.3

i not use tablesorter plugin pager, because content scrollable (not pages) , have scroll bars without scroller plugin. maybe problem?

code tablesorter:

$(document).ready(function () {    $("#fsi_srvovtable")     .tablesorter({       theme: "bootstrap",       widthfixed: true,       showprocessing   : true,        headertemplate: '{content} {icon}',       widgets: ["storage", "savesort", "uitheme", "filter"],       headers: { 0: {                          sorter: false,                          filter: false                     }                },       widgetoptions: {          filter_reset : 'button.reset',          filter_hidefilters: false,          filter_ignorecase: true,          filter_savefilters: true,          filter_cssfilter: "form-control",       }     }) }); 

the table body has height of 663px , content scrollable.

to save scroll position found tips on stackoverflow:

   $("#fsi_srvoverview").on("scroll", function() {       $("#fsi_scroll").html($("#fsi_srvoverview")[0].scrolltop);       if (localstorage) {          var posoverview = localstorage["fsi_srvoverview_scroll"];          if (posoverview) {             localstorage.removeitem("fsi_srvoverview_scroll");          }          localstorage["fsi_srvoverview_scroll"] = $("#fsi_srvoverview")[0].scrolltop;          return true;       }       else {          return false;       }    }); 

after resorting or filtering want restore scroll position of table.

i try .bind("updatecomplete",... , $(window).load(function(){ or $(window).ready(function(){ restore scroll position of table body. not work, if insert window.alert popup message before restore function (i think sure last call).

on website http://callmenick.com/post/check-if-everything-loaded-with-javascript found hint , build this:

   $(window).load(function(){       var everythingloaded = setinterval(function() {          if (/loaded|complete/.test(document.readystate)) {             clearinterval(everythingloaded);             var posoverview = localstorage["fsi_srvoverview_scroll"];             if (posoverview) {                $("#fsi_srvoverview")[0].scrolltop = posoverview;             }          }       }, 10);    });       

that works - table jumping start/beginning , position.

i parameter disable jump or there better way restore scroll position tablesorter?

regards
jochen

the reason scroll position changes because during sorting, tbody detached, table height automatically adjusted browser. once tbody restored, scrollbar doesn't revert it's previous value.

i haven't tested method, if save scroll position in "scrollstart" , "filterstart" event, restore on "filterend" , "sortend", should work. here sample code:

var top, left,   $win = $(window); $('table')   .on('sortstart filterstart', function() {     left = $win.scrollleft();     top = $win.scrolltop();   })   .on('sortend filterend', function() {     $win.scrollleft(left);     $win.scrolltop(top);   })   .tablesorter(); 

the "updatecomplete" event should firing after table gets updated ("update" event); if sortend filterend combo doesn't seem working, try replacing tablesorter-ready.