jQuery EasyUI Tree Menu -Creating an Asynchronous Tree Menu

To create an asynchronous tree menu (Tree), each tree node must have an 'id' attribute, which will be submitted back to the server to retrieve child node data.

Creating a Tree Menu (Tree)

    <ul id="tt" class="easyui-tree"
            url="tree2_getdata.php">
    </ul>

Server-side Code

    $id = isset($_POST['id']) ? intval($_POST['id']) : 0;

    include 'conn.php';

    $result = array();
    $rs = mysql_query("select * from nodes where parentId=$id");
    while($row = mysql_fetch_array($rs)){
        $node = array();
        $node['id'] = $row['id'];
        $node['text'] = $row['name'];
        $node['state'] = has_child($row['id']) ? 'closed' : 'open';
        array_push($result,$node);
    }

    echo json_encode($result);

    function has_child($id){
        $rs = mysql_query("select count(*) from nodes where parentId=$id");
        $row = mysql_fetch_array($rs);
        return $row[0] > 0 ? true : false;
    }

Download jQuery EasyUI Examples

jeasyui-tree-tree2.zip

Other Extensions