JQuery1.8 Datatables saving state on click of a button

谁都会走 提交于 2019-12-07 06:05:27

问题


I have a jsp with a table and two buttons "home" and "back" in it and have imported jquery.datatable.js in it.

On click of "home" the page should load without any pagination or filter saved. and on click of "back" the table should have all the filter and pagination saved.

I have tried setting the "bStateSave" flag true while initializing the data table. This always loads the table with the filter and pagination.

Is there any way I can load the table with saved state on click of "back" button and its original state on click of "home" button


回答1:


For DataTables 1.10:

Below are API functions for DataTables 1.10 related to state saving:

state()
Get the last saved state of the table

state.clear()
Clear the saved state of the table.

state.loaded()
Get the table state that was loaded during initialisation.

state.save()
Trigger a state save.

You need to have stateSave: true initialization option to enable state saving. Then, when user clicks the "Home" button, you can call $('#example').DataTable().state.clear() to clear the saved state.

For DataTables 1.9 and earlier:

Unfortunately there is no direct API method to clear saved state.

You need to have bStateSave: true initialization option to enable state saving.

Option 1: Using document.cookie:

Below is a hack intended to clear cookie that contains state data. When user clicks the "Home" button, you need to execute the code below. IMPORTANT: Replace example with your table ID.

// Reset current state
document.cookie = name + 'SpryMedia_DataTables_' + 'example' + '=; expires=Thu, 01 Jan 1970 00:00:01 GMT;';

Option 2: Using fnStateLoadParams:

Alternatively, you may want to use fnStateLoadParams callback function to determine when to load or ignore state data. Determine on page load whether state should be loaded or ignored by assigning true or false respectively to loadStateParams variable:

$(document).ready( function() {
  $('#example').dataTable( {
    "bStateSave": true,
    "fnStateLoadParams": function (oSettings, oData) {
       // Disallow state loading by returning false  
       var loadStateParams = false;

       return loadStateParams;
    }
  });
});


来源:https://stackoverflow.com/questions/30797848/jquery1-8-datatables-saving-state-on-click-of-a-button

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!