Easyui menu tree instance loading json in PHP + MySQL background

Instance a Php+mysql+easyui Tree menu loads JSON data from the background

Implementation function: Load all the database names from the database, the corresponding database load the corresponding database table name

Load the tree asynchronously

Tree supports the built-in asynchronous load mode, the user creates an empty tree, and then defines a remote server site to return JSON data to populate the tree to meet asynchronous load requirements asynchronously

<ul id= "Tree" ></ul>

Loading data using JavaScript

<script>
$ (' #tree '). Tree (
{
URL: ' tree_getdata.php '
});
</script>

Tree loading is via URL ' tree_getdat.php ' site. The loading of child nodes depends on the state of the parent node. When a shutdown node is expanded, if the node does not have a child node load, the Send Node ID value is used as the HTTP parameter, and the parameter is named ' ID ' to the remote server. Defined by the above URL. Retrieving child node data
View a set of data returned from the server

[{         "id": 1,          "text":  "node 1",         "state":   "Closed",         "Children": [{              "id": 11,              "text":  "node 11"        },{              "id": 12,             "Text":  "node 12"        }]   },{          "id": 2,         "text":  "node 2",          "state":  "closed"   }] 

What we need to do is put the data back in the background together into the above format
Foreground code is the above code
the background code is as follows:

<?php require ('./mysql_connect/mysql_connect.php ');
$db _select= @mysqli_select_db ($dbc, ' information_schema '); if ($DBC) {        //query all database names        
  $sql = "select schema_name from schemata where schema_name not in           (' information_schema '  ,  ' Performance_schema '  
  ' MySQL ');
         $rs = @mysqli_query ($dbc, $sql);         if ($RS)         {                  //Storage Final Results   
           $items =array ();             //              $result =array ();             while ($row =mysqli_fetch_array ($rs, MYSQLI_ASSOC)             {                 //echo  $row [' schema_name ']. "
  ";                  $result [' ID ']= $row [' schema_name ']; //id                  //Intermediate Value               
   $schema _name= $row [' schema_name '];                                    $result [' Text ']= $row [' Schema_name ']; //text                  $result [' State ']= ' closed ';   //state    
              $children =array ();                 //echo $ Schema_name. "
  ";                 //$sql = "Select  table_name from tables where table_schema= $row [' schema_name '] ';  display SQL statement errors                   $sql = "select 
Table_name from tables where table_schema= ' $schema _name ' ";                  $res = @mysqli_
Query ($DBC, $sql);                 while ($r = Mysqli_fetch_array ($rES,MYSQLI_ASSOC))                  {                     //    echo  $r [' table_name ']. "
  ";                   
       $table _name= $r ["table_name"];                          array_push ($children, array ("id" => $table _name, "text" => $table _name)); The Id,text                 in/childer
          $result [' Children ']= $children;                     &nBsp                 }                  array_push ($items, $result) ;  //(1)             }                             //echo json_encode ($result);(2)              echo json_encode ($items);  //(3)        &nbsp}}
else{        echo  "Connect error". Mysql_connect_error ($DBC); ?>

At first No (1) (3), such as (2) output, found that the front desk can not be loaded out, and then output background data carefully read most of the genius found himself a format is this:
{"id": "TPSS", "text": "Tpss", "state": "Closed", "children": [{"id": "T_prekeychart", "text": "T_prekeychart"}]}
Unlike the request format, the outermost layer is less than one [...], then thought about adding (1), (3), and then the test passed.
Screenshot on:

The next step is the DataGrid data on the right.
Additional additions: Require ('./mysql_connect/mysql_connect.php ') content

<?php /*      does not select the corresponding database when establishing a connection to MySQL       Select the database to connect via mysqli_select_db ($DBC, db_name) on other pages     eg:      require  ('./mysql_connect.php ');  //relative path      $db _select=mysqli_select_db ($
DBC, ' db_name ');     if (! $dbc) {     #coding ...     }      else{         #coding ...     } */define ('
Db_user ', ' root ');
Define (' Db_password ', ' 1234 ');
Define (' db_host ',  ' localhost ');
Connection $dbc = @mysqli_connect (Db_host,db_user,db_password)  OR  die (' Cannot connect to MySQL: '. Mysqli_connect_error ()); Sets the character set Mysqli_set_charset ($dbc, ' utf8 '); 

Example two uses jquery Easyui and thinkphp to implement menu tree

Demand:

The database has a table department table that contains 3 primary fields: ID, ParentID, name, to record the structure of the department. Now we're going to print out the regular tree of this recordset.

Ideas:

Nothing is written to deal with this sort of problem. Preliminary ideas can be read out in SQL and then the backstage sort, so mature demand must have code, so lazy to write, but find a few are not very satisfied, then plan to look for solutions from the front. Sort in the foreground. So I flipped through a few pages of jquery Easyui's document and found a way to fix it:
1, write a simple program, with JSON output all Department records (output address for http://localhost:8080/app/index.php/Department/tree)
2, in the foreground processing this record, sorting. The code is ready-made.

Operation:

Step 1th: Write a function in the corresponding xxxaction page of the template, mainly to output the JSON of the tree

Public function tree ()
{
$subproject = M (' department ');
$list = $subproject->select ();
Echo Json_encode ($list);
}

Step 2nd: Copy the following code to the head of the template page:

<script type= "Text/javascript" >     function convert (rows) {         function exists (Rows, parentid) {             for (var i=0; i<rows.length; i++) {                 if  (rows[i].id =
= parentid)  return true;             }       
      return false;         }            
      var nodes = [];         // get the top level nodes          for (Var i=0; i<rows.length; i++) {            var row =
 rows[i];             if  (!exists (rows,  Row.parentid)) {                 nodes.push ({                     id:row.id,                      text:row.name        
         });             }          }                  
var todo = [];       &Nbsp; for (var i=0; i<nodes.length; i++) {       
     todo.push (Nodes[i]);         }         while ( Todo.length) {            var node =  todo.shift ()     // the parent node              // get the children nodes    
         for (var i=0; i<rows.length; i++) {                 var row
 = rows[i];                 if  ( Row.parentid == node.id) {       &Nbsp;            var child = {id:
Row.id,text:row.name};                      if  (node.children) {            
            node.children.push (child);                      } else {             
           node.children = [child];                      }                       todo.push (child);                 }   
          }         }
        return nodes; &NBSP;&NBSP;&NBSP;&NBSP}          $ (function () {         $ (' #tt '). Tree ({             url:  ' Http://localhost:8080/app/index.php/Department/tree ',              loadfilter: function (rows) {       
         return convert (rows);             }       
  });
    }); </script> 

Step Three:

The body of the template adds a line of code:

<ul id= "tt" ></ul>