Binding components to dhtmlXDataStore

Components, bound to dhtmlXDataStore will keep their data synchronized with the data stored in dhtmlXDataStore. They will also be bound with each other (e.g. grid and form).

Methods using for data binding

sync() - copies all the data from store (used for multirecords components like grid).
bind() - copies just a single record related to some item (used for single record component like form).
and dataFeed() - helps to reload data from the server (instead of the master component).

Binding cases

binding components to dhtmlXDataStore:

var list1 = new dhtmlXDataStore({ url:"../data/data1.json", datatype:"json" });
grid.sync(list1);

binding 2 DataStores:

var data1 = new dhtmlXDataStore({ url:"../data/data1.json", datatype:"json" });
var data2 = new dhtmlXDataStore({ url:"../data/data2.json", datatype:"json" });
 
data2.bind(data1, function(data, filter){
	if (filter)
		return data.id == filter.id;
});
 
grid1.attachEvent("onRowSelect", function(id){
	data1.setCursor(id);
});
grid1.sync(data1);
grid2.sync(data2);

binding DataStore to server-side:

var data1 = new dhtmlXDataStore({ url:"../data/data1.json", datatype:"json" });
var data2 = new dhtmlXDataStore({ dataFeed:"../data/json.php", datatype:"json" });
 
data2.bind(data1, function(data, filter){
		filter.Package = "Filter by "+data.Package;
});
 
grid1.attachEvent("onSelectStateChanged", function(id){
	data1.setCursor(id);
});
grid1.sync(data1);
grid2.sync(data2);