This article describes how to use JQuery to write a dynamic tree.
The Code is as follows:
// Business type tree
Var settingOther = {
Edit :{
Enable: false
},
// Asynchronously load the tree
Async :{
Enable: true,
Url: "initCoagencyTree. action ",
AutoParam: ["id", "name = n"],
OtherParam: {"otherParam": "zTreeAsyncTest "},
DataFilter: filter
},
// Simple data format
Data :{
SimpleData :{
Enable: true
}
},
// Callback function
Callback :{
BeforeClick: beforeClick,
OnClick: onClick
}
};
// Mouse event
Function beforeClick (treeId, treeNode, clickFlag ){
// Normal selection
If (clickFlag = 1 ){
Parent.doc ument. getElementById ("coagencyId"). value = treeNode. id;
Parent.doc ument. getElementById ("parentId"). value = treeNode. pId;
Parent.doc ument. getElementById ("name"). value = treeNode. name;
$ ("# CoagencyId"). attr ("value", treeNode. id );
$ ("# ParentId"). attr ("value", treeNode. pId );
} Else {
// Unselect and leave the value Blank
$ ("# CoagencyId"). attr ("value", null );
$ ("# ParentId"). attr ("value", null );
}
Return (treeNode. click! = False );
}
// How to remove a node with the mouse
Function onClick (event, treeId, treeNode, clickFlag ){
// Displays the node details by default.
Parent. showCoagencyDetail ();
}
// Asynchronous loading requires a function
Function filter (treeId, parentNode, childNodes ){
If (! ChildNodes) return null;
For (var I = 0; I ChildNodes [I]. name = childNodes [I]. name. replace (/\. n/g ,'.');
}
Return childNodes;
}
// Asynchronous loading requires a function
Function beforeAsync (treeId, treeNode ){
Return treeNode? TreeNode. level <5: true;
}
// Initialization tree
$ (Document). ready (function (){
$. Fn. zTree. init ($ ("# coagencyTree"), settingOther );
});
SCRIPT