NEW VERSION RELEASED! Webix 11 Read More Core Updates, Extended Functionalities in SpreadSheet and File Manager and more

DataTree State Object, JavaScript Programming Example of DataTree State Object

JavaScript Programming Example of DataTree State Object

Meet the programming example of DataTree state object. This piece of code allows you to save and then restore the state of your tree with ease. Pay attention that you are welcome to use coding samples by Webix for accelerating your web development projects.

JS Code

//loading from file
var tree = {
  view:"tree",
  id:"tree",
  data:tree_data,
  height:500,
  select:true
};

var buttons = {
  padding:10, rows:[
    { view:"button", width:150, value:"Save state", click:save_state },
    { view:"button", width:150, value:"Restore state", click:restore_state }
  ]
};

webix.ready(function(){
  webix.ui({
     rows:[
      {
        cols:[
          tree,
          buttons
      	]
      }
    ]
  });
});

function save_state(){
  webix.storage.local.put("state", $$("tree").getState());
};

function restore_state(){
  var state = webix.storage.local.get("state");
  if (state)
    $$("tree").setState(state);
};

Want to stop worrying about restoring tree state and other stuff related to DataTree?