Jquery ztree asynchronous search (search for leaves) practice, jqueryztree

Jquery ztree asynchronous search (search for leaves) practice, jqueryztree

I. Initial asynchronous loading tree

A root node is provided by default during initialization, and the first layer is manually triggered by asynchronous loading,

The Code is as follows:

Var treeSetting = {async: {enable: true, <a href = "http://my.oschina.net/wealpan/admin/" xxx/demo. do? Method = listByTree "rel =" nofollow "> url:" xxx/demo. do? Method = listByTree </a> ", dataType:" json ", autoParam: [" id = pid "]}, view: {dblClickExpand: true, selectedMulti: false, expandSpeed: ($. browser. msie & parseInt ($. browser. version) <= 6 )? "": "Fast"}, data: {simpleData: {enable: true, idKey: "id", pIdKey: "pid", rootPId: "root" }}, callback: {onNodeCreated: zTreeOnNodeCreated}; // Default root Node var rootNode = {"id": 0, "pid": "root", "name": "item category ", "open": true, "isParent": true}; $ (document ). ready (function () {var zTreeObj = $. fn. zTree. init ($ ("# tree"), treeSetting, rootNode); var node = zTreeObj. getNodeByParam ("id", 0, null); zTreeObj. reAsyncChildNodes (node, "refresh ");});

Ii. asynchronous searching of leaf nodes

Asynchronous fuzzy search of leaf nodes may be used when JQuery ZTREE is used,

 

If zTreeObj. expandNode is used only to expand and modify nodes, asynchronous loading cannot be triggered. In this case, you must manually call the asynchronous loading method for processing. The solution is as follows:
Search parameters are taken to the background by setting values in the otherParam array (otherParam must be set to an empty array if no parameters exist; otherwise, the previous parameter will always be taken to the background ); manually asynchronously load the callback function onNodeCreated after the node is created.

The Code is as follows:

Function searchM () {var param = $. trim ($ ("input [name = 'param']"). val (); var treeObj = $. fn. zTree. getZTreeObj ("tree"); var node = treeObj. getNodeByParam ("id", 0, null); if (param! = "") {Param = encodeURI (param); treeObj. setting. async. otherParam = ["param", param];} when the else {// search parameter is null, the parameter array must be set to null treeObj. setting. async. otherParam = [];} treeObj. reAsyncChildNodes (node, "refresh");} function zTreeOnNodeCreated (event, treeId, treeNode) {var param <span> </span> = $. tr <span> </span> im ($ ("input [name = 'param']"). val (); var treeObj = $. fn. zTree. getZTreeObj ("tree ");// If (param! = "" & TreeNode. isParent) {treeObj. reAsyncChildNodes (treeNode, "refresh ");}};

The above is all about jquery ztree asynchronous search. I hope it will be helpful for your learning.

Articles you may be interested in:

• Jquery zTree asynchronous loading simple instance sharing
• How to combine jquery dialog with ztree
• Jquery ztree uses json data in the drop-down tree.
• Summary of common functions and features of the infinite tree Jquery plug-in zTree
• Getting started with Jquery tree plug-in zTree
• Introduction to JQuery ztree asynchronous loading instance
• Jquery ztree for tree search