jquery Write dynamic Tree sample code

This article introduces the use of jquery written by the dynamic tree, the specific implementation of the following, interested friends can learn to copy code code as follows:


//Business type Tree


var settingother = {


Edit: {


Enable:false


},


//Asynchronous Load 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 check


if (clickflag==1) {


parent.document.getElementById ("Coagencyid"). Value=treenode.id;


parent.document.getElementById ("ParentID"). Value=treenode.pid;


parent.document.getElementById ("name"). Value=treenode.name;


$ ("#coagencyId"). attr ("value", treenode.id);


$ ("#parentId"). attr ("value", treenode.pid);


}else{


//Uncheck the value to empty


$ ("#coagencyId"). attr ("value", null);


$ ("#parentId"). attr ("value", null);


}


return (Treenode.click!= false);


}


//mouse method for lifting nodes


function OnClick (event, Treeid, TreeNode, Clickflag) {


//Default execution method displays the details of the node


Parent.showcoagencydetail ();


}


//asynchronous load needs are functions


function Filter (Treeid, ParentNode, childnodes) {


if (!childnodes) return null;


for (var i=0 i<childnodes.length; i++) {


childnodes[i].name = Childnodes[i].name.replace (/.n/g, '. ');


}


return childnodes;


}


//asynchronous load needs are functions


function Beforeasync (Treeid, TreeNode) {


return TreeNode? Treenode.level < 5:true;


}


//initialization of tree


$ (document). Ready (function () {


$.fn.ztree.init ($ ("#coagencyTree"), Settingother);


});


</SCRIPT>


<!--tree Node ID-->


<s:hidden name= "Coagencyform.coagencyid" id= Coagencyid "/>"


<!--tree node parent ID-->


<s:hidden name= "Coagencyform.parentid" id= parentid "/>"


<div class= "Ztreedemobackground left" >


<ul id= "Coagencytree" class= "Ztree" style= "height:640px" ></ul>


</div>