引入css文件
<link rel="stylesheet" type="text/css" href="js/assets/global/plugins/jstree/dist/themes/default/style.min.css" />
引入js文件
<script type="text/javascript" src="js/assets/global/plugins/jstree/dist/jstree.min.js"></script> 前端放一个div用来做为tree的容器
<div style="overflow-y: auto; overflow-x: auto; width: 100%; height: 534px;" id="jstree_bsbm_div"></div> //构造树型结构
var handleTree = function() { getTreeData();
$("#jstree_bsbm_div").on('select_node.jstree', function(node,selected,event) {
//绑定选中事件处理函数
id = selected.node.id;
parent = selected.node.parent;
jc = selected.node.original.jc;
// jcMax = selected.node.original.jcMax;
// gz = selected.node.original.gz;
freshtable();
}).on('refresh.jstree', function(node,selected,event) {
//刷新事件处理函数
getTreeData();
});
}; //获取树形数据
var getTreeData = function(){
var aData = {
type: "2",
roledm: roledm,
}
$.ajax({
type : "POST",
url : "basic/getQxTree",
dataType : "json",
contentType : 'application/json', //定义格式
data : JSON.stringify(aData), //把json转为String传递给后台
success : function(data) {
// var data = [
// { "id" : "ajson1", "parent" : "#", "text" : "Simple root node" ,'state' : {'selected' : true}},
// { "id" : "ajson2", "parent" : "#", "text" : "Root node 2" ,'state' : {'selected' : true}},
// { "id" : "ajson3", "parent" : "ajson2", "text" : "Child 1" ,'state' : {'selected' : false}},
// { "id" : "ajson4", "parent" : "ajson2", "text" : "Child 2" ,'state' : {'selected' : true}},
// ]; $('#jstree_bsbm_div').data('jstree', false).empty();
$("#jstree_bsbm_div").jstree({
'core': {
'data': data,
},
plugins: [ "wholerow", "checkbox","types","themes"],
"checkbox": {
"keep_selected_style": false,//是否默认选中
},
}) // 获取树
var menuTrees = $('#jstree_bsbm_div').jstree(true);
// 清空级联关系
var oldCascade = menuTrees.settings.checkbox.cascade;
menuTrees.settings.checkbox.cascade = '';
// 重置级联关系
setTimeout(function () {
menuTrees.settings.checkbox.cascade = oldCascade;
}, 500); },
error : function(e) {
Metronic.alert({
type: 'danger',
icon: 'warning',
message: '树形数据获取失败!',
place: 'prepend',
closeInSeconds:5,
container:'#profileAlertsMsg',
focus:true
});
}
});
};

jsTree checkbox plugin使用笔记的更多相关文章

  1. jstree CHECKBOX PLUGIN

    The checkbox plugin makes multiselection possible using three-state checkboxes. Configuration overri ...

  2. jstree 插件的使用笔记(一)

    官方:http://www.jstree.com/  一.节点的描述 官方资料:http://www.jstree.com/docs/json/ 格式一 { id : "string&quo ...

  3. Openflow Plugin学习笔记3

    MDController.java 中的start方法,创建了SwitchConnectionHandlerImpl实例 SwitchConnectionHandlerImpl switchConne ...

  4. Openflow Plugin学习笔记2

    OpenDaylight OpenFlow Plugin 过载保护 过载保护 OF Plugin中的过载保护按如下流程工作: ConnectionConductor将消息送入队列,是最靠近OFJava ...

  5. Openflow Plugin学习笔记1

    主入口 ConfigurableOpenFlowProviderModule是OpenFlowPlugin中启动加载的入口,如下: @Override public java.lang.AutoClo ...

  6. jsTree的checkbox默认选中和隐藏

    jstree复选框自定义显示隐藏和初始化默认选中 首先需要配置 Checkbox plugin "plugins" : ['checkbox'] 设置默认选中状态(checkbox ...

  7. JQuery/JS插件 jsTree加载树,普通加载,点一级加载一级

    前端: <!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <tit ...

  8. JQuery/JS插件 jsTree加载树,预先加载,初始化时加载前三级节点,当展开第三级节点时 就加载该节点下的所有子节点

    jsTree加载树, 初始化时 加载前三级节点, 当展开第三级节点时 就加载该节点下的所有子节点 html: <!DOCTYPE html> <html> <head&g ...

  9. 利用jstree插件轻松构建树应用

    最近完成了项目中的一个树状应用,第一次接触了jstree这个插件,总的来说它的官方文档还是比较详细的,但是在使用过程中还是出现了一些问题,下面我就来谈谈这款插件的使用和心得. 首先项目需要构建一棵树, ...

随机推荐

  1. Spring MVC-控制器(Controller)-属性方法名称解析器(Properties Method Name Resolver )示例(转载实践)

    以下内容翻译自:https://www.tutorialspoint.com/springmvc/springmvc_propertiesmethodnameresolver.htm 说明:示例基于S ...

  2. React Native Mac配置指南

    步骤 http://facebook.github.io/react-native/docs/getting-started.html#content 依照React Native官网步骤一步步安装, ...

  3. ios 使用Safari浏览器跳转打开、唤醒app

    常常使用Safari浏览器浏览网页点击url会唤醒该站点的手机版app 须要在app的project中设置 1.打开project中的myapp-Info.plist文件 2.打开文件里新增URL T ...

  4. UI层自动化测试框架(一)-简介和环境搭建

    http://blog.csdn.net/ToBeTheEnder/article/details/52302777

  5. 替换文件里的相关单词(一)之文件类型为txt

    首先说一下详细的实现思路: 第一步:我们须要获取要改动文件的信息,我们能够通过文件的路径来获取文件的FileInputStream,即文件的输入流,然后调用InputStreamReader读取文件输 ...

  6. [ JavaScript ] JavaScript 实现继承.

    对于javascript中的继承,因为js中没有后端语言中的类式继承.所以js中的继承,一般都是原型继承(prototype). function P (name){ this.name = name ...

  7. Android源码编译全过程记录(基于最新安卓5.1.0)【转】

    本文转载自:http://blog.csdn.net/drg1612/article/details/44802533 我的编译条件: 1 Ubuntu Kylin 14.04 长期支持版 下载地址 ...

  8. mysql数据库操作(1)

    1.mysql 数据库备份: 语法: MYSQLDUMP -uUSER -pPASS DataBase > Path 其中:USER 是用户名,PASS 是密码,DataBase 是数据库名, ...

  9. 昂贵的聘礼(Dijkstra)

    http://poj.org/problem?id=1062 每个物品看成一个节点,酋长的允诺也看作一个物品, 如果一个物品加上金币可以交换另一个物品,则这两个节点之间有边,权值为金币数,求第一个节点 ...

  10. hdu1429胜利大逃亡(bfs)

    胜利大逃亡(续) Time Limit: 4000/2000 MS (Java/Others)    Memory Limit: 65536/32768 K (Java/Others)Total Su ...