Extend from $.fn.datagrid.defaults. Override defaults with $.fn.treegrid.defaults.
The properties extend from datagrid, below is the added properties for treegrid.
Name | Type | Description | Default |
---|---|---|---|
idField | string | Defines the key field to identify a tree node. required. | null |
treeField | string | Defines the tree node field. required. | null |
animate | boolean | Defines if to show animation effect when node expand or collapse. | false |
loader | function(param,success,error) |
Defines how to load data from remote server. Return false can abort this action.
This function takes following parameters: param: the parameter object to pass to remote server. success(data): the callback function that will be called when retrieve data successfully. error(): the callback function that will be called when failed to retrieve data. |
json loader |
loadFilter | function(data,parentId) | Return the filtered data to display. |
The events extend from datagrid, below is the added events for treegrid.
Name | Parameters | Description |
---|---|---|
onClickRow | row | Fires when user click a node. |
onDblClickRow | row | Fires when user dblclick a node. |
onClickCell | field,row | Fires when user click a cell. |
onDblClickCell | field,row | Fires when user dblclick a cell. |
onBeforeLoad | row, param | Fires before a request is made to load data, return false to cancel this load action. |
onLoadSuccess | row, data | Fires when data loaded successfully. |
onLoadError | arguments | Fires when data loaded fail, the arguments parameter is same as the 'error' function of jQuery.ajax. |
onBeforeExpand | row | Fires before node is expanded, return false to cancel this expand action. |
onExpand | row | Fires when node is expanded. |
onBeforeCollapse | row | Fires before node is collapsed, return false to cancel this collapse action. |
onCollapse | row | Fires when node is collapsed. |
onContextMenu | e, row | Fires when node is right clicked. |
onBeforeEdit | row | Fires when user start editing a node. |
onAfterEdit | row,changes | Fires when user finish editing. |
onCancelEdit | row | Fires when user cancel editing a node. |
Many methods take a parameter named 'id', this parameter indicate the tree node value.
Name | Parameter | Description |
---|---|---|
options | none | Return the options of treegrid. |
resize | options | Set treegrid size, the options contains two properties: width: the new width of treegrid. height: the new height of treegrid. |
fixRowHeight | id | fix the specified row height. |
loadData | data | Load the treegrid data. |
reload | id | Reload treegrid data. |
reloadFooter | footer | Reload footer data. |
getData | none | Get the loaded data. |
getFooterRows | none | Get the footer data. |
getRoot | none | Get the root node, return node object |
getRoots | none | Get the root nodes, return node array. |
getParent | id | Get the parent node. |
getChildren | id | Get the children nodes. |
getSelected | none | Get the selected node and return it, if no node selected return null. |
getSelections | none | Get all selected nodes. |
getLevel | id | Get the specified node level. |
find | id | Find the specifed node and return the node data. |
select | id | Select a node. |
unselect | id | Unselect a node. |
selectAll | none | Select all nodes. |
unselectAll | none | Unselect all nodes. |
collapse | id | Collapse a node. |
expand | id | Expand a node. |
collapseAll | id | Collapse all nodes. |
expandAll | id | Expand all nodes. |
expandTo | id | Expand from root to specified node. |
toggle | id | Toggles expanded/collapsed state of the node. |
append | param |
Append nodes to a parent node. The 'param' parameter contains following properties: parent: the parent node id, if not assigned, append as root nodes. data: array, the nodes data. Code example: // append some nodes to the selected row var node = $('#tt').treegrid('getSelected'); $('#tt').treegrid('append',{ parent: node.id, // the node has a 'id' value that defined through 'idField' property data: [ id: '073', name: 'name73' ] }); |
remove | id | Remove a node and it's children nodes. |
refresh | id | Refresh the specified node. |
beginEdit | id | Begin editing a node. |
endEdit | id | End editing a node. |
cancelEdit | id | Cancel editing a node. |
getEditors | id | Get the specified row editors. Each editor has the following properties: actions: the actions that the editor can do. target: the target editor jQuery object. field: the field name. type: the editor type. |
getEditor | options | Get the specified editor, the options contains two properties: id: the row node id. field: the field name. |