Loading and Manipulating Data

Dynamic Loading in TreeGrid

Dynamic loading means loading the levels on request (on opening a node that has children). To make it work in dhtmlxTreeGrid the following requirements should be fulfilled:

When initializing TreeGrid, the URL of the server routine that returns the nested level should be specified:
```
treegrid.kidsXmlFile="pro_treeGrid_dynamic.php";
```
This routine will get the URL parameter's id that is the id of the row that was opened (in other words, id of the row that is the parent of the level that should be returned by the above-mentioned routine).

Initial TreeGrid XML (as well as the XML returned by the routine mentioned in the previous point) should have <row> tags with the attribute xmlkids="1" (only the rows that have child items):

<row id="parent1" xmlkids="1"> 
    <cell>...</cell> 
    ...

JSON format:

{
    rows:[
        {id:"parent1",xmlkids:"1", data:["row A"]}
    ]
};

The XML returned by the routine specified in the first point should have the attribute parent="xxx" in the top level tag <rows>:

<rows parent="parent1"> 
    <row id="child1" xmlkids="1"> 
        <cell>...
        ...

Smart Parsing in TreeGrid

Smart parsing can increase the performance of the TreeGrid control when the user has lots of nodes and levels in it. Smart parsing can be enabled in the following way:

treegrid.enableSmartXMLParsing(true);

Related sample: Smart Parsing

Setting Item's Label

The following method is used for setting item's label in TreeGrid:

treegrid.setLabel(val); // new label value

Adding/Removing Rows

It's simple to add a new row into dhtmlxTreeGrid with the help of the method addRow:

treegrid.addRow(new_id, text, ind);

The parameters of the method are responsible for the following:

new_id - id of a new row;
text - array/string of row labels, can be a comma-separated list or an array;
ind - should be set to null;
parent_id - id of the parent row;
img - url to images for this new row;
child(true/false) - child flag, optional.

Expanding/Collapsing Rows

The following methods should be used to expand/collapse a row in the TreeGrid:

treegrid.openItem(rowId);
treegrid.closeItem(rowId);