Easyui Creating an asynchronous tree menu and dynamically adding tab pages

Create an asynchronous Tree menu

2. Add a tree menu to the UL label

   class="easyui-tree" id="treemenu"></ul>

   View Code
4. Write JS code, use the tree function for the UL tag element of the menu

   $ ('#treeMenu'). Tree ({    URL:'tree_data.json '  // });

   View Code
5. Writes a page that is used to asynchronously fetch data (Tree_data.json page).
   The required JSON value is returned (this is used instead of the data obtained from the database to omit the connection to the database process)

   $result = [];//Node One$PRODARR = [    "ID"=1,    "text"="Commodity Management",    " State"="Open",    "Children"= [        [            "ID"=2,            "text"="Add Item",            " State"="Open",            "attributes"= [                "URL"="http://abc.com/test.php"            ]        ],        [            "ID"=3,            "text"="Modify a product",            " State"="Open",            "attributes"= [                "URL"="http://abc.com/test2.php"            ]        ]    ]];//node Two$NEWSARR = [    "ID"=Ten,    "text"="News Management",    " State"="Open",    "Children"= [        [            "ID"= A,            "text"="Add News",            " State"="Open"        ],        [            "ID"= -,            "text"="Modify News",            " State"="Open"        ]    ]];//node three$USERARR = [    "ID"= -,    "text"="User Management",    " State"="Open",    "Children"= [        [            "ID"= A,            "text"="Add User",            " State"="Open"        ],        [            "ID"= at,            "text"="Modify User",            " State"="Open"        ]    ]]; Array_push ($result, $PRODARR, $NEWSARR, $USERARR); Echo Json_encode ($result);

   View Code

   Description
   Properties of the node:
   ID: Node ID, which can be used as a parameter to get child node data asynchronously to a page address
   Text: node literal
   State: Node status. The value is open (the default value) or close. When set to close, data for child nodes is automatically fetched asynchronously
   Checked: Indicates whether the node is selected.
   Attributes: Custom Properties
   Children: Include child nodes as arrays

Here, the asynchronous tree menu is complete.

Dynamically Add tab page

Easyui Creating an asynchronous tree menu and dynamically adding tab pages