To bind a value from a database to a ztree

1. (Idea: Sort the database tables in a certain format, then serialize them into JSON strings, bind to Ztree and show them)

ztree v3.5.16 API documentation : http://www.ztree.me/v3/api.php

2, add the application and display location, set the tree needs to bind the fields, and the database in the table field (note: The setting tree is expanded state)

<Scriptsrc= "/common/jquery-1.8.3.min.js"type= "Text/javascript"></Script><Linkhref= "/admin/tree/ztreestyle.css"rel= "stylesheet"type= "Text/css" />    <Scriptsrc= "/admin/tree/jquery.ztree.core-3.5.js"type= "Text/javascript"></Script> 

<style= "margin:0 auto;border:1px solid #617775; background: #f0f6e4; width:578px; height:460px;  Overflow:auto; " >    <ul id= "tree" class= "Ztree" ></ul></div>

<script type= "Text/javascript" >varsetting ={data: {key: {//use TreeNode's ItemName property as the node nameName: "ItemName"}, Simpledata: {//whether to use simple data modeEnabletrue,                    //Current Node ID propertyIdKey: "Id",                    //parent Node ID property of the current nodePIdKey: "Pitemid",                    //used to remediate the root node's parent node data, that is, the property value specified by Pidkeyrootpid:0}}, view: {//support for selecting multiple nodes simultaneouslySelectedmulti:false            }        }; $(function() {$.post ("Test.aspx",function(JSON) { var treeobj = $.fn.ztree.init ($ ("#tree"), setting, JSON);                           //Expand all nodes by defaultTreeobj.expandall (true);        });           }); </script>

3. Get data from database tables, convert to JSON string, and display it as a tree in the foreground

usingSystem;usingSystem.Collections.Generic;usingSystem.Data; Public Partial classtest:system.web.ui.page{protected voidPage_Load (Objectsender, EventArgs e) {                //on the server side, determine if request is from an AJAX request (asynchronous) or a traditional request (synchronous)        if(request.headers["X-requested-with"] !=NULL&& request.headers["X-requested-with"]. ToLower () = ="XMLHttpRequest". ToLower ()) {//clears all content output from the buffer streamResponse.Clear (); //set the HTTP Mimel type of the output streamResponse.ContentType ="Application/json"; //writes a string to the HTTP corresponding output streamResponse.Write (Getjson ()); //sends all current buffered output to the client, stopping the execution of the pageResponse.End (); }         }    //serialization, converting an object to a JSON string    protected stringGetjson () {//provides serialization and deserialization capabilities for Afax-enabled applicationsSystem.Web.Script.Serialization.JavaScriptSerializer JSON =NewSystem.Web.Script.Serialization.JavaScriptSerializer (); List<Express.Model.AdminLeft> list =NewList<express.model.adminleft>(); //get the list of administrator modulesList =Express.BLL.AdminLeft.GetList (); //convert an object to a JSON string      return JSON.    Serialize (list);        }}

* 4. Sort the tables in the database in the form of a tree (that is, prepare the JSON strings to be converted to the requirements later)

  /// <summary>        ///get all columns with a name that is not empty/// </summary>         PublicList<model.adminleft>GetList () {stringsql =string. Format ("SELECT * from Adminleft where itemname<> "order by case" Pitemid=0 then id*10000 else Pitemid*10000+id end< /c6>"); List<Model.AdminLeft> list =NewList<model.adminleft>(); using(SqlDataReader dr = DBUtility.SqlHelper.ExecuteReader (connstring.connreadonly, CommandType.Text, SQL,NULL))            {                 while(Dr. Read ()) {Model.adminleft Model=NewModel.adminleft (); Objectobj; obj = dr["Id"]; if(obj! =NULL&& obj! =DBNull.Value) {model. Id= (int) obj; } obj = dr["Pitemid"]; if(obj! =NULL&& obj! =dbnull.value) {Model.pitemid= (int) obj; } model. ItemName = dr["ItemName"].                                      ToString (); List.                ADD (model); }            }            returnlist; }

Summary of knowledge points involved:

(1) Case-when usage in SQL (Note: The purpose of the sorting is to convert to a JSON format that conforms to the requirements, and then serialize it to a JSON string, bound to Ztree and displayed.) ）

2, "serialization" converts the state of an object into a format that can be persisted or transmitted (in JSON format). The serialized complement is deserialized, which converts the stream to an object. Together, these two processes ensure that data is easy to store and transfer.

3. "X-requested-with" can determine whether the request is from an AJAX demand (asynchronous) or a traditional request (synchronous) by its null.

4, "Response.Clear ();" Clears all content output from the buffer stream. (Google Chrome)

Reference: How to use case in sql: http://www.cnblogs.com/Ronin/archive/2006/07/20/455756.html

JSON serialization and deserialization http://www.cnblogs.com/wangdongxu1984/archive/2010/02/01/1661134.html#undefined

HTTP protocol detailed http://www.cnblogs.com/TankXiao/archive/2012/02/13/2342672.html