easy UI树形复选框

首先,展示一下结果

这个是使用easyui的combotree控件来实现的,具体的代码如下:

1,声明一个复选框

<select id="rolePer" name="permissionNameList" class="easyui-combotree" style="width:200px;"
                            data-options="url:'/sysPer/getpertree',required:true,checkbox:true,multiple:true"></select>

制定其url的路径以及获取的值

2,url获取的值的格式如下

[{"id":3,"text":"系统管理","children":[{"id":5,"text":"用户管理","children":[{"id":6,"text":"用户新增","children":null},{"id":7,"text":"用户查询","children":null},{"id":10,"text":"用户删除","children":null},{"id":11,"text":"用户修改","children":null}]},{"id":12,"text":"机构管理","children":[{"id":13,"text":"机构新增","children":null},{"id":14,"text":"机构查询","children":null},{"id":16,"text":"机构删除","children":null},{"id":17,"text":"机构修改","children":null}]},{"id":18,"text":"权限管理","children":[]},{"id":19,"text":"角色管理","children":[{"id":21,"text":"新增角色","children":null},{"id":22,"text":"编辑角色","children":null},{"id":23,"text":"修改角色","children":null},{"id":24,"text":"删除角色","children":null}]},{"id":25,"text":"修改密码","children":[]}]},{"id":26,"text":"事件管理","children":[]},{"id":27,"text":"设备管理","children":[]}]

3,这些都完成之后,可以根据

var pids = $('#rolePer').combotree('getValues');

来获取选择的值

4,在edit的时候,也可以通过

 $('#rolePer').combotree("setValues",row.permissionIdList);

这个来实现。

上面是简单记录一下这个控件的使用方法,具体的实现可以参考文档api,注意,要使用的版本和api的版本要保持一直

 

转载于:https://www.cnblogs.com/ningheshutong/p/6426407.html

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值