stateLoadCallback

Since: DataTables 1.10

Callback that defines where and how a saved state should be loaded.

Description

With this callback you can define where, and how, the state of a table is loaded from. By default DataTables will load from localStorage or sessionStrorage, but for more permanent storage, you can store state in a server-side database.

Prior to DataTables 1.10.13 this method had to act synchronously, i.e. the state would be returned by the function. As of 1.10.13 it is possible to load state asynchronously via Ajax or any other async method and execute the callback function, passing in the loaded state.

To maintain backwards compatibility the state can still be returned synchronously. To use the callback method, simply don't return a value from your stateLoadCallback function. See below for examples of both use cases.

Note that this callback works hand-in-hand with stateSaveCallback. This callback loads the state from storage when the table is reloaded while stateSaveCallback saves it.

Type

function stateLoadCallback( settings, callback )

Parameters:
Returns:

If the data is loaded synchronously the return value should be the loaded state (or null if no data was loaded).

If the data will be loaded asynchronously (e.g. via Ajax), undefined should be returned (just don't use a return statement!) and the callback function called when the state has been loaded. Please note that this option required DataTables 1.10.13 or newer.

Examples

Load state from a server via Ajax (1.10.13 or newer):

$('#example').DataTable( {
	stateSave: true,
	stateLoadCallback: function (settings, callback) {
		$.ajax( {
			url: '/state_load',
			dataType: 'json',
			success: function (json) {
				callback( json );
			}
		} );
	}
} );

Load state from a server via Sjax (prior to 1.10.13):

$('#example').DataTable( {
	stateSave: true,
	stateLoadCallback: function (settings) {
		var o;

		// Send an Ajax request to the server to get the data. Note that
		// this is a synchronous request since the data is expected back from the
		// function
		$.ajax( {
			url: '/state_load',
			async: false,
			dataType: 'json',
			success: function (json) {
				o = json;
			}
		} );

		return o;
	}
} );

Related

The following options are directly related and may also be useful in your application development.