Nestable-master
来源:互联网 发布:js设置input必填 编辑:程序博客网 时间:2024/06/05 08:09
编写嵌套的HTML列表,如下所示:
<div class="dd"> <ol class="dd-list"> <li class="dd-item" data-id="1"> <div class="dd-handle">Item 1</div> </li> <li class="dd-item" data-id="2"> <div class="dd-handle">Item 2</div> </li> <li class="dd-item" data-id="3"> <div class="dd-handle">Item 3</div> <ol class="dd-list"> <li class="dd-item" data-id="4"> <div class="dd-handle">Item 4</div> </li> <li class="dd-item" data-id="5"> <div class="dd-handle">Item 5</div> </li> </ol> </li> </ol></div>
然后激活jQuery像这样:
$('.dd').nestable({ /* config options */ });
该change
项目时重新排序事件。
$('.dd').on('change', function() { /* on change event */});
$('.dd').nestable('serialize');
上面示例的序列化JSON将是:
[{"id":1},{"id":2},{"id":3,"children":[{"id":4},{"id":5}]}]
可以更改以下选项:
maxDepth
各级项目可以嵌套数(默认5
)group
组ID,允许列表之间拖动(默认0
)
这些高级配置选项也可用:
listNodeName
HTML元素创建列表(默认'ol'
)itemNodeName
HTML元素创建列表项目(默认'li'
)rootClass
类根元素.nestable()
被上使用(默认'dd'
)listClass
在类的所有列表中的元素(默认'dd-list'
)itemClass
在类的所有列表项元素(默认'dd-item'
)dragClass
应用于列表元素类正在拖动(默认'dd-dragel'
)handleClass
类每个列表项中的内容元素(默认'dd-handle'
)collapsedClass
适用于列出类已经倒塌(默认'dd-collapsed'
)placeClass
类占位符元素(默认'dd-placeholder'
)emptyClass
用于空列表占位符元素类(默认'dd-empty'
)expandBtnHTML
用来生成一个列表项展开按钮的HTML文本(默认'<button data-action="expand">Expand></button>'
)collapseBtnHTML
用来生成一个列表项折叠按钮的HTML文本(默认'<button data-action="collapse">Collapse</button>'
)
1 0
- Nestable-master
- JQuery可拖拽插件:NesTable
- jquery-nestable控件使用
- jquery.nestable 树型结构
- 如何让 Nestable 组件不能拖动
- Bootstrap框架使用拖拽插件Nestable
- Nestable 可移动的树型结构的使用(jQuery)
- Master-Master Master-slave 区别
- master to master replication
- MongoDB Master+Master同步
- Master-Master架构
- 使用json时出现java.lang.ClassNotFoundException: org.apache.commons.lang.exception.Nestable的bug
- net.sf.json.JSONObject java.lang.ClassNotFoundException: org.apache.commons.lang.exception.Nestable
- Dual Master 复制架构(Master-Master)
- Dual Master 复制架构(Master-Master)
- Master Data
- Master page_enableeventvalidation
- master..xp_cmdshell
- CAN总线在嵌入式Linux下驱动程序的实现
- getResources.getColor弃用与取代
- 更新多个表的不同字段到一个表中
- 可枚举属性和不可枚举属性
- 单词翻转
- Nestable-master
- iOS10 本地通知
- git的使用
- java 反射机制
- 文本分类
- [FAQ19142]VOIP APK与普通电话交互导致普通电话无声
- 保存JSP页面状态的4个内置对象
- 浅谈 SQL 中的锁(四)如何检查重复用户
- javaWeb中前台页面怎么获取根路径并以何种方式打开链接