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 ...
随机推荐
- Spring Cloud ZooKeeper集成Feign的坑1,错误:Consider defining a bean of type 'org.springframework.web.client.RestTemplate' in your configuration.
错误如下: ERROR 31473 --- [ main] o.s.b.d.LoggingFailureAnalysisReporter : *************************** A ...
- sql sever 等待事件
http://blog.csdn.net/dba_huangzj/article/details/7607844
- DELPHI新版本WEBSERVICE的变化
DELPHI新版本WEBSERVICE,不仅可以编译成ISAPI DLL,依靠IIS部署, 并且还可以编译成单独的EXE,不再依赖IIS就可以独立运行,这一点未尝不可以说是非常方便的改进.
- Qt学习之QListWidget删除Item
将QListWidgetItem从QListWidget列表中删除有两种方法能够做到.但也要依据自己的须要进行选择. 第一种是 QListWidgetItem *takeItem(int row); ...
- input屏蔽历史记录 ;function($,undefined) 前面的分号是什么用处 JSON 和 JSONP 两兄弟 document.body.scrollTop与document.documentElement.scrollTop兼容 URL中的# 网站性能优化 前端必知的ajax 简单理解同步与异步 那些年,我们被耍过的bug——has
input屏蔽历史记录 设置input的扩展属性autocomplete 为off即可 ;function($,undefined) 前面的分号是什么用处 ;(function($){$.ex ...
- tableView优化
※ tableView优化 概括说:1.使用不透明视图.2.不要重复创建不必要的table cell.3.减少视图的数目.4.不要做多余的绘制工作.5.预渲染图像.6.不要阻塞主线程. 详细说:1.使 ...
- git-svn for mac
熟练使用 git ,新公司用的是 svn,这就尴尬了,为了这个习惯问题,我还是毅然坚持使用 git,但是又不与公司的 svn 冲突,所以就找到了 git 的 git-svn 插件. 在 mac 上使用 ...
- 【Bzoj2456】mode
Position: http://www.lydsy.com/JudgeOnline/problem.php?id=2456 List Bzoj2456 mode List Description S ...
- 用回调函数创建一个XMLHttpRequest,并从一个TXT文件中检索数据。
<script> var xmlhttp; function loadXMLDoc(url,soyo) { if (window.XMLHttpRequest) {// IE7+, Fir ...
- PCB 内层负片散热PAD Symbols尺寸更改方法
如下图这是我们熟悉的内层负片散热PAD Symbols,我们CAM制作时,为了满足PCB工厂生产制作能力,,会优化散热PAD尺寸,让热PAD的尺寸符合制作规范要求,通常我们只关注散热PAD的3个指标即 ...