Saving values of current sorting column, page number, and page size, and re-apply them

Pingpong

I need to save all values of current sorting column (column index, and sorting direction), page number, and page size every time user make changes to them on UI, then users can click a link from each row on the data, and be redirected to a page, and later on be redirected back to the datatable page, and all the selections before leaving this page must apply.

My questions:
1 How to read sorting column (column index, and sorting direction), page number, and page size via JavaScript? So that I can save them to querystring when users are redirected away from the apge.

2 How to apply these values above to restore the datatable when uses are redirected back to the datatable page?

kthorngren

See if the stateSave option does what you want.

Kevin

Pingpong

Please correct me if I am wrong, stateSave uses cookie, thus, it is not ideal.

I want to save and load them manually. For example, read the values of sorting column (column index, and sorting direction), page number, and page size, and then use those values to restore the state of the datatable.

Specifically, once I read the values, I will save it to querystring, instead of cookie, and then read those values from querystring, and use them to restore the state of the datatable.

Is it possible?

kthorngren

According to the stateSave docs the default storage is this:

Data storage for the state information in the browser is performed by use of the localStorage or sessionStorage HTML5 APIs

You could use stateSaveCallback to save in an alternate location.

Otherwise you can use various Datatable's API's, such as order() or page.info() to get the desired information about the Datatable state.

Kevin

Pingpong

Hi kthorngren,

The order() works great. What is the method for page.info() to re-draw() the datatable? like the order() below:

table.order( [ 2, 'asc' ] )
.draw();

draw() is not available below:

table.page.info({
end: 60,
length: 10,
page: 5,
pages: 18,
recordsDisplay: 18,
recordsTotal: 18,
serverSide: true,
start: 50
})
.draw();

kthorngren

The page.info() is a getter only, you can't us it to set values. Use page() to set the page. Use page.len() to set the page length.

Kevin

Pingpong

Hi kthorngren,
Thanks a lot .