Test demo of jquery and zTree tree structure, jqueryztreedemo
Js Code:
<link type="text/css" rel="stylesheet" href="../../../plugin/zTree/css/zTreeStyle/zTreeStyle.css" /><script src="../../../js/jquery-1.9.1.min.js"></script><script src="../../../plugin/zTree/js/jquery.ztree.all-3.5.js"></script>
<! -- Note that the jquery-1.9.1.min.js must be introduced before jquery. ztree. all-3.5.js -->
<Script type = "text/javascript" language = "javascript"> var setting = {async: {enable: true, type: 'post', url: "treedata. json "}, data: {simpleData: {// simple data source
Enable: true, idKey: "id", // id and pid, tree directory level pIdKey: "pId", rootPId: 0 // root node }}, check: {// checkbox check box enable: true, // show or do not show chkboxType: {"Y": "", "N": "" }}, callback: {onAsyncSuccess: zTreeOnAsyncSuccess/** callback function settings, callback function submitted successfully **/}; function zTreeOnAsyncSuccess () {alert ("success") ;}$ (document ). ready (function () {// initialize the ztree object $. fn. zTree. init ($ ("# cityTree"), setting); $ ('# City '). comboboxTree ({url: 'comboboxtree. json'}) ;}); </script>
Html code:
<Div class = "row"> <div class = "col-2"> <p class = "summer-grid-title"> birthplace </p> </div> <div class = "col-2"> <ul id = "cityTree" class = "ztree"> </ul> </div> <div class = "col-4"> <input type = "text" id = "city" name = "city" class = "summer-input" data-validate = "required: true; "> </div>
Question about creating a tree menu with ztree of jQuery
This should not be difficult .. Go to the directory tree example of the next Dtree on the Internet (if you cannot find it, I can send it to you ). Upload a list in the background. The object saved in this list has a list attribute of the subnode. After processing in the background, use the c label on the foreground to traverse the list. You can control the node of the tree based on varstatus. index.
A question about the Jquery tree: You guys, I want to use ztree31 to create a tree. It's okay to construct the tree separately.
Is there a problem with your browser compatibility, or does the page contain declarations such as <public Doc?