首先,展示一下结果

这个是使用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的版本要保持一直

												

easy UI树形复选框的更多相关文章

  1. easy ui datagrid 让某行复选框不能选中

    //百度查找出来的 onLoadSuccess: function(data){//加载完毕后获取所有的checkbox遍历             if (data.rows.length > ...

  2. Qt树形控件QTreeView使用1——节点的添加删除操作 复选框的设置

    QtreeView是ui中最常用的控件,Qt中QTreeWidget比QTreeView更简单,但没有QTreeView那么灵活(QTreeWidget封装的和MFC的CTreeCtrl很类似,没有m ...

  3. 雷林鹏分享:jQuery EasyUI 树形菜单 - 创建带复选框的树形菜单

    jQuery EasyUI 树形菜单 - 创建带复选框的树形菜单 easyui 的树(Tree)插件允许您创建一个复选框树.如果您点击一个节点的复选框,这个点击的节点信息将向上和向下继承.例如:点击 ...

  4. UI设计规范:单选按钮 vs 复选框,没那么简单

    无论是网页设计,还是移动app设计,都经常用到单选按钮和复选框这两个组件.这两个组件看似意义明确,很好区分,但在实际设计中却很容易用错,带来不好的用户体验. 本文中我通过列举几个典型的错误用法,帮助设 ...

  5. elementui禁用树形结构全部复选框

    需求:编辑回显数据后,禁用树形结构复选框,不可选中,无复选框也不可选中 <el-tabs v-model="activeName" @tab-click="hand ...

  6. 安卓开发:UI组件-RadioButton和复选框CheckBox

    2.5RadioButton 为用户提供由两个及以上互斥的选项组成的选项集. 2.5.1精简代码 在按钮变多之后,多次重复书写点击事件有些繁琐,我们在这里创建一个事件OnClick,每次点击时调用该事 ...

  7. MVC树控件,mvc中应用treeview,实现复选框树的多层级表单控件

    类似于多层级的角色与权限控制功能,用MVC实现MVC树控件,mvc中应用treeview,实现复选框树的多层级表单控件.最近我们的项目中需要用到树型菜单,以前使用WebForm时,树型菜单有微软提供的 ...

  8. 关于textjs的tree带复选框的树

    通过查阅一些资料和自己之前了解到的一些相关知识,有时项目中需要用到.话不多说,先看一下效果图: 我写的这人员选择的树,主要是改写了TreePanel,如下代码: ExtendTreePanel.js ...

  9. DevExpress TreeList控件的复选框

    作者:jiankunking 出处:http://blog.csdn.net/jiankunking TreeList控件能够同一时候显示树结构和其它数据列,即在一个列上建立父子关系展开或收缩,同一时 ...

随机推荐

  1. CSS学习(九)-CSS背景

    一.理论: 1.background-break  a.bounding-box 背景图像在整个内联元素中进行平铺 b.each-box 背景图像在行内中进行平铺 c.continuous 下一行的背 ...

  2. WebService 之 协议篇

    Web Service 使用的是 SOAP (Simple Object Access Protocol)简单对象访问协议,是交换数据的一种协议规范,是一种轻量的.简单的.基于XML(标准通用标记语言 ...

  3. Gstreamer学习

    Gstreamer学习笔记----Gstreamer架构设计思想 http://blog.csdn.net/tx3344/article/details/7497434 Gstreamer到底是个啥? ...

  4. vue 项目心得

    v-bind 数据绑定 可以简写成 : 通过 props 将数据对象 传给 组件 export default { props: { seller: { type: Object } } } crea ...

  5. ionic 隐藏header-ionic中隐藏头部header

    ionic 中隐藏头部header 通过 hide-nav-bar="true" 来实现 <ion-view hide-nav-bar="true"> ...

  6. js 立即执行函数定义方法

    <!DOCTYPE html> <html lang="zh"> <head> <meta charset="UTF-8&quo ...

  7. 细说linux IPC(一):基于socket的进程间通信(上)

        [版权声明:尊重原创.转载请保留出处:blog.csdn.net/shallnet 或 .../gentleliu,文章仅供学习交流,请勿用于商业用途]     在一个较大的project其中 ...

  8. cocos2d-x:初探TestLua

    打开\cocos2d-x-2.2.3\cocos2d-win32.vc2012.sln sln里面有个TestLuaproject 初探完成...(不要逗) 启动一下project,cocos2d-x ...

  9. HR*创建人员要素链接

    HRMS(Human Resource Management System) --人员 per_people_f --人员分配 per_all_assignments_f --要素 DECLARE l ...

  10. Codeigniter 使用 Mysql 存储过程

    本篇文章由:http://xinpure.com/codeigniter-using-mysql-stored-procedures/ 执行存储过程 $query = $this -> db - ...