Webix library offers its own API for working with application cache and browser local storages: permanent cache, per session cache and cookies.
Accordingly, webix.storage module contains the following objects:
The objects share three methods:
Local storage can be used for storing any data of an application, e.g. the current state of a component derived with getState() method.
To do this, you put() state object into Webix local storage under a custom name. The data you save should be in the JSON format (which is exactly what getState() returns).
function save_state(){
webix.storage.local.put("state", grid.getState());
}
If the data you'd like to save is a plain JavaScript object, apply Webix serialize() method to it.
To retrieve data from a local storage, use the get() method pointing to the name under which you've saved this or that data.
function restore_state() {
var state = webix.storage.local.get("state");
if (state)
grid.setState(state);
}
Related sample: DataTable State Object::Session
Although Webix library offers a ready-to-use solution, you can write your own proxy object to enable offline support and set it as the component's url property:
webix.ui({
view:"datatable",
..config..
url:{
$proxy: true,
load: function(view) {//save data after editing
view.attachEvent("onAfterEditStop", function(){
webix.storage.local.put("app_data", this.serialize());
});
view.load("data/data.json", {
success: function(text){//fresh data, save in cache
webix.storage.local.put("app_data", text)
},
error: function(){ //probably in offline mode
view.parse(webix.storage.local.get("app_data"));
}
});
}
}
});
The webix.storage module provides the prefix() function to help you avoid possible collisions. It allows you to make the name of the store more unique by upgrading any existing storage (local, session or cookie) with an auto-prefixing functionality.
The method takes two parameters:
mystore = webix.storage.prefix("app_id", webix.storage.local);
// putting data into the local cache under the name "app_id_session_key"
mystore.put("session_key", 12)
mystore.get("session_key") // getting data from the local storage
// -> 12
Back to top