1、效果图(思路:将数据库表按照一定的格式排序,然后序列化成json字符串,绑定到Ztree上并显示出来)

zTree v3.5.16 API 文档 :http://www.ztree.me/v3/api.php

2、添加应用及显示的位置,设置树需要绑定的字段,与数据库里面的表字段有关(备注:设置树为展开状态)

<script src="/common/jquery-1.8.3.min.js" type="text/javascript"></script>
<link href="/Admin/tree/zTreeStyle.css" rel="stylesheet" type="text/css" />
<script src="/Admin/tree/jquery.ztree.core-3.5.js" type="text/javascript"></script>
<div 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">
var setting = {
data: {
key: {
//将treeNode的ItemName属性当做节点名称
name: "ItemName"
},
simpleData: {
//是否使用简单数据模式
enable: true,
//当前节点id属性
idKey: "Id",
//当前节点的父节点id属性
pIdKey: "pItemId",
//用于修正根节点父节点数据,即pIdKey指定的属性值
rootPId: 0
}
},
view: {
//是否支持同时选中多个节点
selectedMulti: false
}
}; $(function () {
$.post("test.aspx", function (json) {
var treeObj = $.fn.zTree.init($("#tree"), setting, json);
//默认展开所有节点
treeObj.expandAll(true);
});
});
</script>

3、获取数据库表中数据,转换为JSON字符串,并在前台以树的形式显示出来

using System;
using System.Collections.Generic;
using System.Data; public partial class test : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
//在服务器端判断request来自Ajax请求(异步)还是传统请求(同步)
if (Request.Headers["X-Requested-With"] != null && Request.Headers["X-Requested-With"].ToLower() == "XMLHttpRequest".ToLower())
{
//清除缓冲区流中的所有内容输出
Response.Clear();
//设置输出流的HTTP MIMEl类型
Response.ContentType = "application/json";
//将一个字符串写入HTTP相应输出流
  Response.Write(GetJson());
 //将当前所有缓冲的输出发送到客户端,停止该页的执行
Response.End();
}
}
//序列化,将对象转化为JSON字符串
protected string GetJson()
{
//为启用 AFAX 的应用程序提供序列化和反序列化功能
System.Web.Script.Serialization.JavaScriptSerializer json = new System.Web.Script.Serialization.JavaScriptSerializer();
List<Express.Model.AdminLeft> list = new List<Express.Model.AdminLeft>();
//获取管理员模块列表
list = Express.BLL.AdminLeft.GetList();
//将对象转换为JSON字符串
return json.Serialize(list);
}
}

*4、将数据库中表按照树状结构的形式排序(即为以后转换成符合要求的json字符串作准备)

  /// <summary>
/// 获取所有名称不为空的栏目
/// </summary>
public List<Model.AdminLeft> GetList()
{
string sql = string.Format("select * from AdminLeft where itemName<>'' order by case when pItemId=0 then Id*10000 else pItemId*10000+Id end");
List<Model.AdminLeft> list = new List<Model.AdminLeft>();
using (SqlDataReader dr = DBUtility.SqlHelper.ExecuteReader(ConnString.connReadonly, CommandType.Text, sql, null))
{
while (dr.Read())
{
Model.AdminLeft model = new Model.AdminLeft();
object obj;
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);
}
}
return list;
}

备注:排序后的数据库表

涉及的知识点总结:

(1)sql中case when 用法(备注:排序的目的是为了转换成符合要求的Json格式,然后序列化成json字符串,绑定到Ztree上并显示出来。)

2、【序列化】将对象状态转换为可保持或传输的格式(json格式)的过程。序列化的补集是反序列化,后者将流转换为对象。这两个过程一起保证数据易于存储和传输。

3、【X-Requested-With】可以通过它是否为空判断request来自Ajax请求(异步)还是传统请求(同步)。

4、【Response.Clear();】清除缓冲区流中的所有内容输出。(谷歌浏览器)

参考资料:SQL中case的使用方法: http://www.cnblogs.com/Ronin/archive/2006/07/20/455756.html

JSON序列化及反序列化 http://www.cnblogs.com/wangdongxu1984/archive/2010/02/01/1661134.html#undefined

HTTP协议详解 http://www.cnblogs.com/TankXiao/archive/2012/02/13/2342672.html

从数据库里面取值绑定到Ztree的更多相关文章

  1. mysql数据库TINYINT取值范围详解

    分享下mysql中TINYINT的取值范围,很基础的一些内容. 在MySQL的数据类型中,Tinyint的取值范围是:带符号的范围是-128到127.无符号的范围是0到255(见官方<MySQL ...

  2. OAF_JDBC系列1 - 数据库交互取值方式(案例)

    2014-06-15 Created By BaoXinjian

  3. loadrunner:从数据库中取值进行参数化

    下面我们介绍用数据库中的用户名来参数化登陆用户名. 框选住登陆名,点鼠标右键,弹出对话框,选择"替换为新参数"弹出对话框,此时参数名输入:name,参数类型选择File,如图 点& ...

  4. loadrunner动态从mysql取值 [需要下载跟数据库服务器一致的dll,32位或64位]

    loadrunner中有参数化从数据库中取值,但是只是静态的,对于一些要实时取值的数据就game over了,比如取短信验证码,因为MySQL中有一个libmysql.dll,里面提供了可以操作数据库 ...

  5. js从后台无法取值问题

    前台代码 <script type="text/javascript"> $(function () { var chart; $(document).ready(fu ...

  6. loadrunner动态从mysql取值

    loadrunner动态从mysql取值 [需要下载跟数据库服务器一致的dll,32位或64位] loadrunner中有参数化从数据库中取值,但是只是静态的,对于一些要实时取值的数据就game ov ...

  7. loadrunner 参数化-如何从数据库中取数据-连接数据库进行参数化

    LoadRunner提供两种参数化取值方式,一种是手动编辑,另一种就是通过连接数据库取值.一般在大型业务并发压力测试时,数据量肯定也都是非常大的,所以手动去编辑就不切实际了,这时用连接数据库的功能就方 ...

  8. CYQ.Data 快速开发之UI(赋值、取值、绑定)原理

    昨夜园子猴子问了几个我CYQ.Data使用的小问题,经过简单解答后,他表示“妈妈再也不用担心我的学习",并于事后以资鼓励,希望这框架越走越好. 除了技术上的交流,双方在生活,S上面的问题上也 ...

  9. jsf初学selectOneMenu 绑定与取值

    jsf 的selectOneMenu 最后生成的<select>标签.这里涉及到一个binding 起初一直不知道是干嘛的,后来参考了其他文章.就相当于在asp.net 中如:<as ...

随机推荐

  1. TCP连接(Time_Wait、Close_Wait)说明

    修改Time_Wait和CLOSE_WAIT时间 修改Time_Wait参数的方法 (在服务端修改)Windows下在HKEY_LOCAL_MACHINE/SYSTEM/CurrentControlS ...

  2. 【React Native 实战】商品分类

    1.前言 商品分类是各种app常见的一种操作,一般都是左右两栏构成,左边栏是商品的分类,右边栏是商品的展示,同时左右两栏都可以滑动.今天我们就用React Native来实现这种效果. 实现内容:1) ...

  3. Cocos2d-x 程序是如何开始运行与结束的

    题记:对于技术,我们大可不必挖得那么深,但一定要具备可以挖得很深的能力   问题的由来   怎么样使用 Cocos2d-x 快速开发游戏,方法很简单,你可以看看其自带的例程,或者从网上搜索教程,运行起 ...

  4. Android之桌面组件AppWidget

    转载:Android之桌面组件App Widget初探 Android开发应用除了程序应用,还有App Widget应用.好多人会开发程序应用而不会开发App Widget应用.本帖子就是帮助大家学习 ...

  5. Java微框架:不可忽视的新趋势--转载

    原文:http://www.infoq.com/cn/news/2015/06/Java-Spark-Jodd-Ninja?utm_campaign=infoq_content&utm_sou ...

  6. 深入理解 iOS 开发中的锁

    来源:伯乐在线 - 夏天然后 链接:http://ios.jobbole.com/89474/ 点击 → 申请加入伯乐在线专栏作者 摘要 本文的目的不是介绍 iOS 中各种锁如何使用,一方面笔者没有大 ...

  7. 1.5.8 语言分析器(Analyzer)

    语言分析器(Analyzer) 这部分包含了分词器(tokenizer)和过滤器(filter)关于字符转换和使用指定语言的相关信息.对于欧洲语言来说,tokenizer是相当直接的,Tokens被空 ...

  8. iOS 定位系统 知识

    最近在做考勤定位系统 总结一些定位系统的知识. 后期会出一份算法主要攻克地球坐标和火星坐标转换的 1.关于百度的火星坐标定位策略 地图SDK/定位SDK的定位策略: WIFI + 基站 +GPS 三者 ...

  9. Java基础知识强化之多线程笔记06:Lock接口 (区别于Synchronized块)

    1. 简介 我们讲到了如何使用关键字synchronized来实现同步访问.本文我们继续来探讨这个问题,从Java 5之后,在java.util.concurrent.locks包下提供了另外一种方式 ...

  10. 【Mood-20】滴滤咖啡做法 IT工程师加班必备 更健康的coffee 项目经理加班密鉴

    Drip Coffee