DHTMLX Docs & Samples Explorer

Managing CRUD operations in bound components

To perform any data manipulation in the bound-to-DataStore component(s), you should remember the main thing - operations are performed under components indirectly, by means of the related dhtmlxDataStore object.
What does it mean? If you want, for example, delete some record from a grid, you should delete it from DataStore the grid is bound to. After the record is deleted from Datastore, it automatically will be deleted from the grid. And it concerns any operation: update, deletion, creation, filtration or sorting.

var store = new dhtmlXDataStore({  
	url:"php/data.php"
});
 
myGrid.sync(store);
...
var selectedItem = myGrid.getSelectedRowId();
store.remove(selectedItem);

Tip 1

Some components (grid, dataview, form, when they are bound to dataStore, start to have the method save(item_id) available. The method allows you to save changes in Datastore programmatically.

Let's assume, you have a grid. When you edit some record and press 'Enter', the changes are saved automatically. To save some data programmatically, just call:

var store = new dhtmlXDataStore();
 
myDP = new dataProcessor("php/data.php");
myDP.init(store);
 
grid.sync(store);
var selectedItem = myGrid.getSelectedRowId();
grid.save(selectedItem);

Tip 2

The second tip concerns the method setCursor(item_id). When you deal with several components you can be confused while loading data from master to slave components - for which one to call the method. Remember, the method is called for the master to push data to slaves.

For example, if you have a grid bound to DataStore and a form bound to the grid and want to update form data, call:

myform.bind(mygrid);
mygrid.setCursor(row_id);