jstree CHECKBOX PLUGIN
The checkbox
plugin makes multiselection possible using three-state checkboxes.
Configuration
override_ui
A boolean. Default is false
.
If set to true
all selection will be handled by checkboxes. The checkbox plugin will map UI's get_selected function to its ownget_checked function and overwrite the UI reselect function. It will also disable the select_node
, deselect_node
anddeselect_all
functions. If left as false
nodes can be selected and checked independently.
checked_parent_open
A Boolean. Default is true
.
When set to true
when programatically checking a node in the tree all of its closed parents are opened automatically.
two_state
A boolean. Default is false
.
If set to true
checkboxes will be two-state only, meaning that you will be able to select parent and children independently and there will be no undetermined state.
real_checkboxes
A boolean. Default is false
.
If set to true
real hidden checkboxes will be created for each element, so if the tree is part of a form, checked nodes will be submitted automatically. By default the name of the checkbox is "check_" + the ID of the LI element
and the value is 1
, this can be changed using the real_checkboxes_names
config option.
real_checkboxes_names
A function. Default is function (n) { return [("check_" + (n[0].id || Math.ceil(Math.random() * 10000))), 1]; }
.
If real checkboxes are used this function is invoked in the current tree's scope for each new checkbox that is created. It receives a single argument - the node that will contain the checkbox. The function must return an array consisting of two values - the name for the checkbox and the value for the checkbox.
Demos
Using the checkbox plugin - all you need to do is include it in the list of active plugins.
1 |
$( function () { |
2 |
$( "#demo1" ).jstree({ |
3 |
"plugins" : [ "themes" , "html_data" , "checkbox" , "sort" , "ui" ] |
4 |
}); |
5 |
}); |
API
._prepare_checkboxes ( node )
Inserts the checkbox icons on the node. Used internally.
mixed
nodeThis can be a DOM node, jQuery node or selector pointing to an element within the tree.
._repair_state ( node )
Repairs the checkbox state inside the node. Used internally.
mixed
nodeThis can be a DOM node, jQuery node or selector pointing to an element within the tree.
.change_state ( node , uncheck )
Changes the state of a node. Used mostly internally - you'd be better off using the check_node
and uncheck_node
functions. Triggers an event.
mixed
nodeThis can be a DOM node, jQuery node or selector pointing to an element within the tree.
boolean
uncheckIf set to
true
the node is unchecked, if set tofalse
the node is checked, otherwise - the state is toggled.
.check_node ( node )
Checks a node.
mixed
nodeThis can be a DOM node, jQuery node or selector pointing to an element within the tree.
.uncheck_node ( node )
Unchecks a node.
mixed
nodeThis can be a DOM node, jQuery node or selector pointing to an element within the tree.
.check_all ( )
Checks all nodes.
.uncheck_all ( )
Unchecks all nodes.
.is_checked ( node )
Checks if a node is checked. Returns boolean.
mixed
nodeThis can be a DOM node, jQuery node or selector pointing to an element within the tree.
.get_checked ( context, get_all ), .get_unchecked ( context, get_all )
Both functions return jQuery collections.
mixed
contextThis can be a DOM node, jQuery node or selector pointing to an element within the tree. If specified only nodes inside the specified context are returned, otherwise the whole tree is searched.
boolean
get_allBy default these functions return only top level checked/unchecked nodes (if a node is checked its children are note returned), if this parameter is set to
true
they will return all checked/unchecked nodes.
.show_checkboxes ( ), .hide_checkboxes ( )
Show or hide the checkbox icons.
jstree CHECKBOX PLUGIN的更多相关文章
- jsTree checkbox plugin使用笔记
引入css文件 <link rel="stylesheet" type="text/css" href="js/assets/global/pl ...
- jsTree的checkbox默认选中和隐藏
jstree复选框自定义显示隐藏和初始化默认选中 首先需要配置 Checkbox plugin "plugins" : ['checkbox'] 设置默认选中状态(checkbox ...
- JQuery/JS插件 jsTree加载树,普通加载,点一级加载一级
前端: <!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <tit ...
- JQuery/JS插件 jsTree加载树,预先加载,初始化时加载前三级节点,当展开第三级节点时 就加载该节点下的所有子节点
jsTree加载树, 初始化时 加载前三级节点, 当展开第三级节点时 就加载该节点下的所有子节点 html: <!DOCTYPE html> <html> <head&g ...
- 利用jstree插件轻松构建树应用
最近完成了项目中的一个树状应用,第一次接触了jstree这个插件,总的来说它的官方文档还是比较详细的,但是在使用过程中还是出现了一些问题,下面我就来谈谈这款插件的使用和心得. 首先项目需要构建一棵树, ...
- jquery插件开发(checkbox全选的简单实例)
html代码: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www ...
- JQuery 目录树jsTree插件用法
PHP循环构造目录树结构 <ul> <php> function digui($fid,$level){ $class=M("wangpan_class") ...
- 无限分级和tree结构数据增删改【提供Demo下载】
无限分级 很多时候我们不确定等级关系的层级,这个时候就需要用到无限分级了. 说到无限分级,又要扯到递归调用了.(据说频繁递归是很耗性能的),在此我们需要先设计好表机构,用来存储无限分级的数据.当然,以 ...
- Ultimate Facebook Messenger for Business Guide (Feb 2019)
Ultimate Facebook Messenger for Business Guide (Updated: Feb 2019) By Iaroslav Kudritskiy November 2 ...
随机推荐
- js禁止滚动条滚动,并且滚动条不消失,页面大小不变
//禁止滚动条滚动 function unScroll() { var top = $(document).scrollTop(); $(document).on('scroll.unable',fu ...
- 如何在eclipse中用maven编译
在eclipse中用maven编译的方法: 在项目中的“pom.xml”文件上点击右键,在弹出的菜单中选择“Run AS”à“Maveninstall”来编译和生成项目.如下图所示: 在编译和生成过程 ...
- iOS截取视频某一帧图片(关键帧,AVAssetImageGenerator)
获取第一帧图片 导入 AVFoundation.Framework.CoreMedia.Framework 实现代码例如以下: + (UIImage*) thumbnailImageForVideo: ...
- Ubuntu下用hadoop2.4搭建集群(伪分布式)
要真正的学习hadoop,就必需要使用集群,可是对于普通开发人员来说,没有大规模的集群用来測试,所以仅仅能使用伪分布式了.以下介绍怎样搭建一个伪分布式集群. 为了节省时间和篇幅,前面一些步骤不再叙述. ...
- CF 445B(DZY Loves Chemistry-求连通块)
B. DZY Loves Chemistry time limit per test 1 second memory limit per test 256 megabytes input standa ...
- Android实现一个自己定义相机的界面
我们先实现拍照button的圆形效果哈.Android开发中,当然能够找美工人员设计图片,然后直接拿进来.只是我们能够自己写代码实现这个效果哈.最经常使用的的是用layout-list实现图片的叠加, ...
- The Secant Method(正割法、弦截法) 附C语言代码
弦截法是一种求方程根的基该方法,在计算机编程中经常使用. 他的思路是这种:任取两个数x1.x2,求得相应的函数值f(x1).f(x2).假设两函数值同号,则又一次取数.直到这两个函数值异号为止. 连接 ...
- JMeter常用函数 使用图解
函数的调用都是以${__function()}这种形式开始的注意:“__”是两个英文下划线 __UUID 生成唯一字符串
- Codesys——限定符的使用方法[来自Codesys的Help]
Qualifier for actions in SFC In order to configure in which way the actions should be associated to ...
- .NET平台下Redis使用(三)【ServiceStack.Redis学习】
MVC4项目下对redis进行增删该查 Models文件下实体类: public class Book { public string BookName {get;set;} public strin ...