Test demo for jquery and Ztree tree structures

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 jquery-1.9.1.min.js must be placed 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 does not display            Chkboxtype: {"Y": "", "N": "}        },        Callback: {            onasyncsuccess:ztreeonasyncsuccess  /** callback function set, submit successful callback function **/        }    };   function ztreeonasyncsuccess () {       alert ("Success");   }    $ (document). Ready (function () {//Initialize 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></div>

Test demo for jquery and Ztree tree structures