onDataRequest

fires when dynamically-loaded data is requested

void onDataRequest(id id, [function callback,string url] ){ ... };

Parameters

ididid of the parent node whose the children should be loaded
callbackfunctioncallback function, if any
urlstringserver API endpoint, if any

Example

tree.attachEvent("onDataRequest", function (id, callback, url) {
    // code
});

Related samples

Details

Dynamic loading for tree-like structures is triggered for nodes with the webix_kids flag set. When those nodes are expanded, the loadBranch method is automatically called. The component will use the data source specified either by its url property or in the url parameter passed to the load method.

When looking at the related samples, note that during the initial loading, data is returned with the webix_kids property set:

{ id: 1, value: "Branch 1", webix_kids: true }

This event can be used to change the default data loading logic:

tree.attachEvent("onDataRequest", function (id, callback, url) {
  this.parse(
    webix.ajax().get("data/data_dyn_json.php?parent=" + id).then(function (data) {
      //{ parent: id, data:[ ... ]}
      return data.json();
    })
  );
  // cancels default behaviour
  return false;
});

You need to return the following data object in the handler function for the correct processing:

  • parent - id of the related tree branch
  • data - array of data records
See also
Back to top
If you have not checked yet, be sure to visit site of our main product Webix web development library and page of javascript tree data structure product.