Modifying state saving after initialisation

maxouellet

Hi,

I have a table for which I want to save state. However, depending on the user's actions, only specific elements need to be saved. I'm pretty sure I need to use the fnStateSaveParams callback function, but I can't figure out how to modify this function after the DataTable initialisation.

For example, I initialise the table so that filtering and pagination are not saved by default:

[code]
var clientsTable;

$(document).ready(function () {
clientsTable = $('#clientsTable').dataTable({
/* Set state saving */
"bStateSave": true,
"fnStateSaveParams": function (oSettings, oData) {
oData.oSearch.sSearch = "";
oData.iStart = 0;
}
} );
});
[/code]

And then I want a JS function to modify fnStateSaveParams so that, if a user perform a certain action, filtering and pagination will be saved for the DataTable.

I've tried the following code (and multiple variants) to no avail:

[code]
function test() {
var oSettings = clientsTable.fnSettings();
oSettings.aoStateSaveParams.push( {
"fnStateSaveParams": null
} )
}
[/code]

Is there any way to modify fnStateSaveParams? I guess I'm probably doing something wrong, but I can't figure out how to do it.

Thanks for your help!
Max

allan

Can you just call a function inside your fnStateSaveParams closure function that will figure out if the state saving modification is needed or not? Alternative you can bind a custom event listener (and thus unbind when you don't need it) listening for the stateSaveParams event - for example $(table).bind( 'stateSaveParams', function (e, settings, data) {...} ) - event docs: http://datatables.net/docs/DataTables/1.9.0/#stateSaveParams

Allan

maxouellet

Thanks for your answer!

Good ideas, but I think I can't do that in my case, since I only know what to save when the user leaves the page. Simple similar example: a page that has a "Leave page saving state partially" button and a "Leave page saving state completely" button.

I believe the source of the issue is that states are saved as soon as changes are made to the datatable. I guess a working solution would be to remove saved elements from the cookie if they are not needed. Is there any way to do that through DataTables?

maxouellet

Ok, for anyone interested, after playing around with the code, here's the solution I came up with.

I put an onClick function, called test in this case, on my buttons which toggle a boolean variable (this could potentially support more boolean variables if you want to support more possibilities):

[code]
function test() {
saveAll = true;
}
[/code]

Then, I register on the $(window).unload event using JQuery to save the cookie I want with the desired information. In my case, by default, I don't save the filter content and the current page. However, if the saveAll flag is set to true, I just resave the cookie using the following method (which is a modified version of _fnSaveState):

[code]
$(window).unload(function () {
if (saveAll) {
var oSettings = clientsTable.fnSettings();
var i, iLen, bInfinite = oSettings.oScroll.bInfinite;
var oState = {
"iCreate": new Date().getTime(),
"iStart": (bInfinite ? 0 : oSettings._iDisplayStart),
"iEnd": (bInfinite ? oSettings._iDisplayLength : oSettings._iDisplayEnd),
"iLength": oSettings._iDisplayLength,
"aaSorting": $.extend(true, [], oSettings.aaSorting),
"oSearch": $.extend(true, {}, oSettings.oPreviousSearch),
"aoSearchCols": $.extend(true, [], oSettings.aoPreSearchCols),
"abVisCols": []
};
for (i = 0, iLen = oSettings.aoColumns.length; i < iLen; i++) {
oState.abVisCols.push(oSettings.aoColumns[i].bVisible);
}
oSettings.fnStateSave.call(oSettings.oInstance, oSettings, oState);
}
});
[/code]

Obviously, some clean-up still needs to be done, but at least it works! Thank for your help Allan.

allan

NIce one - thanks for sharing your solution with us :-)

Allan