render: function () {
return (
<EJ.TreeView id="treeView" fields={fields} nodeClick={this.onClick}>
</EJ.TreeView>
);
}
//TreeView nodeClick event function
onClick: function (e) {
alert("Node of id " + e.id + "is clicked successfully");
} |
render: function() {
return (
<div id="treeview-default">
<h2>Treeview</h2>
<EJ.TreeView
id="treeView"
fields={fields}
template="#treeTemplate"
allowDragAndDrop={true}
nodeDragStop={this.onDragStop}
nodeDragStart={this.onDragStart}
/>
</div>
);
},
//Event triggered on node drag start
onDragStart: function (e) {
//Checks if the dragged node has parent id ‘7’
if (e.parentElementData.id === "7") {
//Cancels the drag operation
e.cancel = true;
}
},
//Event triggered on node drag stop
onDragStop: function (e) {
//Checks if the dropped node location has parent id ‘7’
if (e.targetElementData.parentId === "7") {
//Cancels the drop operation
e.cancel = true;
}
}, |
render: function() {
return (
<div id="treeview-default">
<h2>Treeview</h2>
<EJ.TreeView
id="treeView"
fields={fields}
template="#treeTemplate"
beforeSelect={this.beforeSelect}
/>
</div>
);
},
//Event triggered before selecting a node
beforeSelect: function (e) {
//Checks if the selected node’s parent id is ‘7’
if (e.nodeDetails.parentId === "7") {
//Cancels the selection operation
e.cancel = true;
}
}, |
this.nodeTemplate = '<div>' + '<div class="treeName">${jobname}</div>' + '<div class="emailAddress">${type}</div>'
'</div>'; |