JsTree中节点添加CheckBox 以及 单选的实现
stree中添加checkbox,需要在初始化时设置plugins属性:
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
|
$('#DpTree').data('jstree', false).empty().jstree({ 'core': { 'data': data.data, "check_callback": true, 'multiple': false, }, "force_text": true, plugins: ["sort", "types", "checkbox", "themes", "html_data"], "checkbox": { "keep_selected_style": false,//是否默认选中 "three_state": false,//父子级别级联选择 "tie_selection": false }, }); |
eg:设置three_state为true时,选择所有子节点后父节点会自动选择。
我的需求是选择一个节点绑定给其他数据,节点只能选择一个,且不可重复。
故,添加如下事件,选择节点后遍历所有选中的节点,更改其checkbox属性。
|
1
2
3
4
5
6
7
8
|
$('#DpTree').on('check_node.jstree', function(event, obj) { var ref = $('#DpTree').jstree(true); var nodes = ref.get_checked(); //使用get_checked方法 $.each(nodes, function(i, nd) { if (nd != obj.node.id) ref.uncheck_node(nd); }); }); |
只能选择一个节点,可用于类似下拉框中的选择。
JsTree中节点添加CheckBox 以及 单选的实现的更多相关文章
- 给C#的treeview控件的部分节点添加checkbox
一.先初始化treeview this.treeView1.CheckBoxes = true; this.treeView1.ShowLines = false; this.treeView1.Dr ...
- Android在listview添加checkbox实现单选多选操作问题(转)
转自:http://yangshen998.iteye.com/blog/1310183 在Android某些开发需求当中,有时候需要在listveiw中加入checkbox实现单选,多选操作.表面上 ...
- Android在listview添加checkbox实现单选多选操作问题
android根据View的不同状态更换不同的背景http://www.eoeandroid.com/thread-198029-1-1.html android 模仿朋友网推出的菜单效果[改进版]h ...
- 完美解决Android在listview添加checkbox实现单选多选操作问题
在Android某些开发需求当中,有时候需要在listveiw中加入checkbox实现单选,多选操作.表面上看上去只是改变checkbox那么简单,然而实际开发中,实现起来并不是那么得心应手.尤其当 ...
- C# treeview控件部分节点添加checkbox
一.先初始化treeview this.treeView1.CheckBoxes = true; this.treeView1.ShowLines = false; this.treeView1.Dr ...
- [原创]纯JS实现网页中多选复选框checkbox和单选radio的美化效果
图片素材: 最终效果图: <html><title> 纯JS实现网页中多选复选框checkbox和单选radio的美化效果</title><head>& ...
- Jquery动态在td中添加checkbox
如图:想要在这个id为headId的<td>中,用jquery动态添加checkbox 代码如下 : data是我用ajax 从后台获取的数据,里面含有若干个user类,我想把所有的人名字 ...
- DataGridView 中添加CheckBox和常用处理方式 .
DataGridView 中添加CheckBox和常用处理方式 文章1 转载:http://blog.csdn.net/pinkey1987/article/details/5267934 DataG ...
- DataGridView中添加CheckBox列用于选择行
DataGridView中添加CheckBox列用于选择行 1,编辑DataGridView,添加一列 CheckBox ,Name 赋值为 "select",如下图: 2,取消 ...
随机推荐
- android学习笔记NO.5
Intent 能够理解为信使 由Intent来协助完毕android各个组件之间的通讯. 感觉基础薄弱就又复习了一遍基础知识,整理了一遍! gen 保存自己主动生成的R资源目录 gen->com ...
- Redis开源项目的终极杀手? ——CRUG解读Redis开源协议变更
引言: 数据库制造商 Redis Labs 本周将公司开发的Redis 模块从 AGPL 迁移到将 Apache v2.0 与 Commons Clause 相结合的许可证,对许可证涵盖的软件作了限制 ...
- java 学习第一步---安装JDK以及配置环境变量
1.下载jdk 链接:https://pan.baidu.com/s/1FiTGhxdHK0KTFawdkLT26g 提取码:zcy0 我已经在官网上面下载了1.8的jdk,通过百度云盘分 ...
- java 翻页工具类
Pagination类 package com.paic.bics.core.mybatis.page; import java.util.List; @SuppressWarnings(" ...
- c# Winform实现中国省份地图
1.利用raphael.js IE下的VML和SVG实现矢量地图 2.JS调用c# Winform代码,代码 [System.Runtime.InteropServices.ComVisibleAtt ...
- 爬虫定时任务 redis 减轻 mysql 读的压力 加层
非工作时间,定时任务爬虫大量mysq短链接,影响了其他业务的,mysql 报 too many connections 错误 将爬虫url池放入到redis中,单独的脚本维护redis url池的更 ...
- POJ 1477:Box of Bricks
Box of Bricks Time Limit: 1000MS Memory Limit: 10000K Total Submissions: 19949 Accepted: 8029 De ...
- HDU 5073 数学题
题目传送门 http://acm.hdu.edu.cn/showproblem.php?pid=5073 这道题RE了好多发啊囧,RE到精神不振. Galaxy的质心并不是一成不变的,随着一些星球的移 ...
- 【Codeforces】716D Complete The Graph
D. Complete The Graph time limit per test: 4 seconds memory limit per test: 256 megabytes input: sta ...
- python-----写入txt用法
代码如下: #!/usr/bin/env python # -*- coding: utf-8 -*- # @Time : 2019/1/14 11:23 # @Author : zxb file_p ...