代码拉取完成,页面将自动刷新
同步操作将从 Allen/combotree 强制同步,此操作会覆盖自 Fork 仓库以来所做的任何修改,且无法恢复!!!
确定后同步将在后台操作,完成时将刷新页面,请耐心等待。
基于layui及zTree的树下拉框组件,把zTree也封装成了layui的模块,无需另外引用,下来面板改为追加到body,防止某种情况下被遮挡
在基于Layui开发后台管理系统时,想要一个下拉树控件控件,在网上找了一些开源的实现,都不是太满意,于是自己动手基于Layui 2.8.x及zTree 3.5.x制作了一个下拉树控件。由于本人是一个后端程序员,且对layui也不熟悉,所以只是实现了一个能用的版本,并不完善,有问题请自行修改或提出修改方案。
下载layztree目录和combotree.js文件放在web工程的js相关文件static目录即可。
// 配置
layui.config({
base: getCtxPath() + '/lib/extends/' // 假设这是存放拓展模块的根目录
}).extend({
layztree: 'layztree/layztree', //combotree需要引用layztree
combotree: 'combotree'
});
layui.use(['layztree','combotree'],function() {
var layztree = layui.layztree;
var combotree = layui.combotree;
// 渲染
combotree.render({
elem: '#elementId'
,placeholder: '请选择'
,isMultiple: false // 是否多选,默认是单选
,yChkboxType: 'ps' // 参考zTree该参数
,nChkboxType: 'ps' // 参考zTree该参数
,expandLevel: '2' // 默认展开的层级
,ajaxUrl: '/xxxxx' // 取得树数据的url
,readonly: false // 是否只读模式
,layVerify: 'required' // 是否是必选项目
,initValue: '100' // 初期选中值,该值为树节点数据的ID,多个的时候以逗号分隔
,callback: {
layonClick: function (event, treeId, treeNode) {
//点击后打算做什么
},
layonCheck: function (event, treeId, treeNode) {
//选中后打算做什么
},
}
});
})
此处可能存在不合适展示的内容,页面不予展示。您可通过相关编辑功能自查并修改。
如您确认内容无涉及 不当用语 / 纯广告导流 / 暴力 / 低俗色情 / 侵权 / 盗版 / 虚假 / 无价值内容或违法国家有关法律法规的内容,可点击提交进行申诉,我们将尽快为您处理。