ztree用法
(1)首先引用ztree的css和js
<link type="text/css" rel="stylesheet" href="zTree/zTreeStyle.css" />
<script type="text/javascript" src="zTree/jquery.ztree.all-3.5.js"></script>
(2) 定义一棵树
<ul id="treeDemo" class="ztree" style="margin-top:0; width:100%; height:auto;"></ul>
(3)将查询的数据放到树种(数据需要有ID parentId name 为查出数据的字段名称)
3.1
var zNodes = ""; //json
function load() {
$.ajax({
type : 'POST',
url : $.el.Register.AppUrl + "path",// 查询数据
dataType : 'json',
async : false,
success : function(data) {
var json = eval(data); // 数组
zNodes = "[";
$.each(json, function(index, item) { 
zNodes += "{id:" + json[index].id
+ ",pId:" + json[index].parentid
+ ",name:'" + json[index].name
+ "'}";
if (index != json.length - 1)
zNodes += ",";
});
zNodes += "]";
},
error : function(e) {
}
});

}
zNodes = eval(zNodes);
$.fn.zTree.init($("#treeDemo"), setting, zNodes);// 树初始化
现在数据绑定在树上
3.2 避免数据重复绑定 先摧毁树 再次初始化 查询数据 对初始化树的数据进行勾选
var zTreeObj = $.fn.zTree.getZTreeObj("treeDemo");
zTreeObj.destroy();

$.fn.zTree.init($("#treeDemo"), setting, zNodes);// 权限树初始化
$.ajax({
type : "POST",
url : $.el.Register.AppUrl + "path",
data : {
条件
},
dataType : 'json',
async : false,
success : function(data) {
var json = eval(data); // 数组
var treeObj = $.fn.zTree.getZTreeObj("treeDemo");
$.each(json, function(index, item) { 
id = json[index].id;
var node = treeObj.getNodeByParam("id", id);
treeObj.checkNode(node, true, false);

});
},
error : function(error) {
}
});

ztree的数据绑定的更多相关文章

  1. zTree的后台数据绑定

    前台js: var treeNodes; $.ajax({ async: false, cache: false, type: 'POST', contentType: "applicati ...

  2. [译]聊聊C#中的泛型的使用(新手勿入) Seaching TreeVIew WPF 可编辑树Ztree的使用(包括对后台数据库的增删改查) 字段和属性的区别 C# 遍历Dictionary并修改其中的Value 学习笔记——异步 程序员常说的「哈希表」是个什么鬼?

    [译]聊聊C#中的泛型的使用(新手勿入)   写在前面 今天忙里偷闲在浏览外文的时候看到一篇讲C#中泛型的使用的文章,因此加上本人的理解以及四级没过的英语水平斗胆给大伙进行了翻译,当然在翻译的过程中发 ...

  3. z-tree的使用

    1.参考资料 1)官网:http://www.treejs.cn/v3/api.php 2)z-tree码云:https://gitee.com/zTree/zTree_v3 2.下载解压 案例演示: ...

  4. UWP中新加的数据绑定方式x:Bind分析总结

    UWP中新加的数据绑定方式x:Bind分析总结 0x00 UWP中的x:Bind 由之前有过WPF开发经验,所以在学习UWP的时候直接省略了XAML.数据绑定等几个看着十分眼熟的主题.学习过程中倒是也 ...

  5. MVVM模式和在WPF中的实现(二)数据绑定

    MVVM模式解析和在WPF中的实现(二) 数据绑定 系列目录: MVVM模式解析和在WPF中的实现(一)MVVM模式简介 MVVM模式解析和在WPF中的实现(二)数据绑定 MVVM模式解析和在WPF中 ...

  6. 前端MVC学习总结(一)——MVC概要与angular概要、模板与数据绑定

    一.前端MVC概要 1.1.库与框架的区别 框架是一个软件的半成品,在全局范围内给了大的约束.库是工具,在单点上给我们提供功能.框架是依赖库的.AngularJS是框架而jQuery则是库. 1.2. ...

  7. vue双向数据绑定原理探究(附demo)

    昨天被导师叫去研究了一下vue的双向数据绑定原理...本来以为原理的东西都非常高深,没想到vue的双向绑定真的很好理解啊...自己动手写了一个. 传送门 双向绑定的思想 双向数据绑定的思想就是数据层与 ...

  8. ztreeDeptSelect 基于jquery和ztree的部门选择插件

    插件介绍 首先我们来看插件的功能演示(效果): 插件准备好后.前台只需编写html: <input type="text" class="deptName" ...

  9. 【Win 10应用开发】分阶段进行数据绑定

    使用x:Bind扩展标记进行数据绑定,是在编译阶段完成,至于说性能优化方面,大概主要是优化CPU资源的使用,因为免去了运行阶段进行绑定的过程.当然,使用这个标记仅仅是绑定上的优化,并不包括数据源.数据 ...

随机推荐

  1. mysql不支持emoji表情的问题的解决方法

    最近财神圈项目集成微信登录功能的过程中,当保存用户有昵称含有表情符号时后台服务抛出异常,原来是数据库默认字符集不支持emoji表情字符.找到问题的原因后,因为之前也没有遇到过这样的问题,也没思路,迅速 ...

  2. javascript 获取当前 URL 参数的两种方法

    window.location.host; //返回url 的主机部分,例如:www.xxx.com window.location.hostname; //返回www.xxx.com window. ...

  3. P3166 [CQOI2014]数三角形

    传送门 直接求还要考虑各种不合法情况,不好计数 很容易想到容斥 把所有可能减去不合法的情况剩下的就是合法情况 那么我们只要任取不同的三点就是所有可能,不合法情况就是三点共线 对于两点 $(x_1,y_ ...

  4. 2018年 CCPC 网络赛 赛后总结

    历程:由于只是网络赛,所以今天就三开了.一开始的看题我看了d题,zz和jsw从头尾看起来,发现c题似乎可做,和费马大定理有关,于是和zz一起马上找如何计算勾股数的方法,比较慢的A掉了,而jsw此时看了 ...

  5. Java的观察者

    class Teacher extends Observable { public void startLesson() { System.out.println(String.format(&quo ...

  6. Observable Flowable Test

    package com.test.rxjava; import java.time.Duration; import java.time.Instant; import java.util.Linke ...

  7. 使用wget下载oracle jdk1.8

    wget --no-cookies --no-check-certificate --header "Cookie: gpw_e24=http%3A%2F%2Fwww.oracle.com% ...

  8. my06_sysbench install for mysql 并初始化表数据

    sysbench安装 ************************************************************** 安装sysbench依赖包 rpm -q autom ...

  9. es6数组新方法

    (1)Array.from(aarr,fn,obj) function fn(dr, sd, d) { /*Array.from 类数组转化为数组*/ console.log(arguments) v ...

  10. ctrip-apollo

    云端多网卡问题: 参考:https://blog.csdn.net/buyaore_wo/article/details/79847404