Saving data using afterChange callback
Use the afterChange callback to track changes made in the table. In the example below,
AJAX
is used to load and save grid data. Note that this is just a mockup. Nothing is actually saved.
You have to implement the server-side part by yourself.
Click "Load" to load data from server
Saving data locally
You can save any sort of data in local storage to preserve the table state after
page reloads. In order to enable the data storage mechanism, the persistentState
option must be set to true
(you can set it either during the Handsontable initialization
or using the updateSettings method).
When persistentState
is enabled it exposes 3 hooks listed below:
Why should I use persistentState rather than regular LocalStorage API?
The main reason behind using persistentState
hooks rather than a regular LocalStorage API
is that it ensures separation of data stored by multiple Handsontable instances. In other words,
if you have two (or more) instances of Handsontable on one page, data saved by one instance
will be inaccessible to the second instance. Those two instances can store data under the same
key and no data would be overwritten.
In order for the data separation to work properly, make sure that each instance
of Handsontable has a unique id
.