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_nodedeselect_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.

  • mixednode

    This 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.

  • mixednode

    This 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.

  • mixednode

    This can be a DOM node, jQuery node or selector pointing to an element within the tree.

  • booleanuncheck

    If set to true the node is unchecked, if set to false the node is checked, otherwise - the state is toggled.

.check_node ( node )

Checks a node.

  • mixednode

    This can be a DOM node, jQuery node or selector pointing to an element within the tree.

.uncheck_node ( node )

Unchecks a node.

  • mixednode

    This 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.

  • mixednode

    This 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.

  • mixedcontext

    This 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.

  • booleanget_all

    By 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的更多相关文章

  1. jsTree checkbox plugin使用笔记

    引入css文件 <link rel="stylesheet" type="text/css" href="js/assets/global/pl ...

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

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

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

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

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

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

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

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

  6. jquery插件开发(checkbox全选的简单实例)

    html代码: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www ...

  7. JQuery 目录树jsTree插件用法

    PHP循环构造目录树结构 <ul> <php> function digui($fid,$level){ $class=M("wangpan_class") ...

  8. 无限分级和tree结构数据增删改【提供Demo下载】

    无限分级 很多时候我们不确定等级关系的层级,这个时候就需要用到无限分级了. 说到无限分级,又要扯到递归调用了.(据说频繁递归是很耗性能的),在此我们需要先设计好表机构,用来存储无限分级的数据.当然,以 ...

  9. Ultimate Facebook Messenger for Business Guide (Feb 2019)

    Ultimate Facebook Messenger for Business Guide (Updated: Feb 2019) By Iaroslav Kudritskiy November 2 ...

随机推荐

  1. Ubuntu 16.04开机自动开启数字键盘NumLock

    注意:以下方法不适合在登录时开启,只能是登录后开启.而且我经过测试之后会自动暗下去,但是不影响功能使用.这个是BUG的修复方法:https://askubuntu.com/questions/5090 ...

  2. 17、Java并发性和多线程-避免死锁

    以下内容转自http://ifeve.com/deadlock-prevention/: 在有些情况下死锁是可以避免的.本文将展示三种用于避免死锁的技术: 加锁顺序 当多个线程需要相同的一些锁,但是按 ...

  3. Eclipse新建/导入Gradle项目

    一.新建 1.[New]->[Project] 二.导入 1.[Import] 2. 参考: http://www.vogella.com/tutorials/EclipseGradle/art ...

  4. [Vue @Component] Write Vue Functional Components Inline

    Vue's functional components are small and flexible enough to be declared inside of .vue file next to ...

  5. Linux下C++访问MySQL数据库

    由于想要开始了解并学习用LAMP进行web开发,所以昨晚我在Fedora上安装了MySQL,学习了MySQL的几个常用命令.想着在学习进行web开发(PHP访问数据库)之前,先用我熟悉的C++连接数据 ...

  6. 【Cocos2dx游戏开发】CCTableView实现滑动列表

    在游戏中,经常需要用到列表展示,例如我现在做的卡牌游戏中就有卡牌列表和好友列表需要用到CCTableView,下面简单介绍一下使用方法. CCTableView位于扩展库文件cocos-ext.h中, ...

  7. Analyze提示:Value stored to &quot;***&quot;is never read

    text这个变量没有被使用,在当前类中搜索'text'这个变量发现仅仅是被赋值并没有被使用. 提示意思是:删除或者凝视这行代码;

  8. Unity3d中相应各平台Path

    IOS: Application.dataPath :                      Application/xxxxxxxx-xxxx-xxxx-xxxx-xxxxxxxxxxxx/xx ...

  9. rel='canonical'

    rel='canonical' <!DOCTYPE html><html><head> <meta charset="utf-8"/> ...

  10. 【HDU1530】【ZOJ1492】Maximum Clique

    Position: http://poj.org/problem?id=3241 http://acm.zju.edu.cn/onlinejudge/showProblem.do?problemCod ...