EasyUI实现二级页面的内容勾选的方法


Posted in Javascript onMarch 01, 2015

EasyUI,在增、删的时候,经常用到二级页面进行勾选。

可以在datagird下面添加onCheck、onUncheck、onSelectAll、onUnselectAll事件。

在这些事件中,将勾选的内容存到map中,并转换成json格式字符串放到隐藏域中。

onCheck : function(rowIndex, rowData) 

   if (rowIndex > -1) {

    var userId= rowData.id;

    if(!dataMap.containsKey(userId))

    {

     dataMap.put(userId, rowData);

      $("input[name=selectData]").val(JSON.stringify(dataMap));

    }

   }

  } ,

  onUncheck : function(rowIndex, rowData) {

   if (rowIndex > -1) {

    var userId= rowData.id;

    if( dataMap.containsKey(userId))

    {

     dataMap.remove(userId);

      $("input[name=selectData]").val(JSON.stringify(dataMap));     

    }

   }

  },

  onSelectAll:function(rows){

   for(var i=0;i<rows.length;i++){

     var rowData=rows[i];

     var userId= rowData.id;

     if(!dataMap.containsKey(userId))

     {

      dataMap.put(userId, rowData);

       $("input[name=selectData]").val(JSON.stringify(dataMap));

     }

   }

  },

  onUnselectAll:function(rows){

   for(var i=0;i<rows.length;i++){

     var rowData=rows[i];

     var userId= rowData.id;

     if( dataMap.containsKey(userId))

     {

      dataMap.remove(userId);

       $("input[name=selectData]").val(JSON.stringify(dataMap));     

     }

   }

  }

在父页面,获取隐藏域中的内容。

selectForm是二级页面的form表单的id,selectData是form表单中存放勾选数据的隐藏域。

将隐藏域中的数据转换成json格式,再用map的形式将数据一个个提取出来。

最后userId和rowData分别为map.elements[i].key和map.elements[i].value。

var f = parent.$.modalDialogTwo.handler.find('#selectForm');

    var selectData = f.find('input[name="selectData"]').get(0).value;

    if (!selectData) {

     parent.$.messager.alert('提示', "请选择一条记录!");

     return;

    }

    var map = jQuery.parseJSON(selectData);

    if (map.elements.length > 0) {

     var nos = new Array();

     var names = new Array();

     for ( var i = 0; i < map.elements.length; i++) {

      var data = map.elements[i];

      nos.push(data.key);

      names.push(data.value.name);

     }

以上就是给大家分享的EasyUI实现二级页面的内容勾选的方法,希望对大家能够有所帮助。

Javascript 相关文章推荐
js不是基础的基础
Dec 24 Javascript
Javascript 构造函数,公有,私有特权和静态成员定义方法
Nov 30 Javascript
javascript中的new使用
Mar 20 Javascript
escape编码与unescape解码汉字出现乱码的解决方法
Jul 02 Javascript
Egret引擎开发指南之发布项目
Sep 03 Javascript
JS实现超精简响应鼠标显示二级菜单代码
Sep 12 Javascript
如何解决ligerUI布局时Center中的Tab高度大小
Nov 24 Javascript
vue.js中指令Directives详解
Mar 20 Javascript
详解es6新增数组方法简便了哪些操作
May 09 Javascript
浅谈redux, koa, express 中间件实现对比解析
May 23 Javascript
Vue element-ui父组件控制子组件的表单校验操作
Jul 17 Javascript
vue集成一个支持图片缩放拖拽的富文本编辑器
Jan 29 Vue.js
EasyUI实现第二层弹出框的方法
Mar 01 #Javascript
EasyUI,点击开启编辑框,并且编辑框获得焦点的方法
Mar 01 #Javascript
浅谈EasyUI中Treegrid节点的删除
Mar 01 #Javascript
浅谈EasyUI中编辑treegrid的方法
Mar 01 #Javascript
EasyUI中combobox默认值注意事项
Mar 01 #Javascript
jquery中EasyUI实现异步树
Mar 01 #Javascript
jquery中EasyUI实现同步树
Mar 01 #Javascript
You might like
php curl发送请求实例方法
2019/08/01 PHP
JQuery 解析多维的Json数据格式
2009/11/02 Javascript
JavaScript 解析Json字符串的性能比较分析代码
2009/12/16 Javascript
EASYUI TREEGRID异步加载数据实现方法
2012/08/22 Javascript
jQuery+css+html实现页面遮罩弹出框
2013/03/21 Javascript
javaScript中两个等于号和三个等于号之间的区别介绍
2014/06/27 Javascript
简介JavaScript中toTimeString()方法的使用
2015/06/12 Javascript
js实现二级菜单渐隐显示
2015/11/03 Javascript
利用jQuery及AJAX技术定时更新GridView的某一列数据
2015/12/04 Javascript
JavaScript中的继承之类继承
2016/05/01 Javascript
Bootstrap基本插件学习笔记之轮播幻灯片(23)
2016/12/08 Javascript
jquery.zclip轻量级复制失效问题
2017/01/08 Javascript
JS基于正则表达式的替换操作(replace)用法示例
2017/04/28 Javascript
VUE Error: getaddrinfo ENOTFOUND localhost
2018/05/03 Javascript
vue超时计算的组件实例代码
2018/07/09 Javascript
vue定义全局变量和全局方法的方法示例
2018/08/01 Javascript
vue实现在一个方法执行完后执行另一个方法的示例
2018/08/25 Javascript
Echart折线图手柄触发事件示例详解
2018/12/16 Javascript
如何在vue 中引入使用jquery
2020/11/10 jQuery
[01:00:14]DOTA2-DPC中国联赛 正赛 Ehome vs Elephant BO3 第二场 2月28日
2021/03/11 DOTA
python控制台显示时钟的示例
2014/02/24 Python
关于Python中浮点数精度处理的技巧总结
2017/08/10 Python
Pythony运维入门之Socket网络编程详解
2019/04/15 Python
Java文件与类动手动脑实例详解
2019/11/10 Python
纯CSS3实现Material Design效果
2017/03/09 HTML / CSS
如何让pre和textarea等HTML元素去掉滚动条自动换行自适应文本内容高度
2019/08/01 HTML / CSS
Melijoe美国官网:法国奢侈童装购物网站
2017/04/19 全球购物
阿根廷旅游网站:almundo阿根廷
2018/02/12 全球购物
外企测试工程师面试题
2015/02/01 面试题
机关门卫制度
2014/02/01 职场文书
数字化校园建设方案
2014/05/03 职场文书
2014年个人委托书范本
2014/10/13 职场文书
2014年妇联工作总结
2014/11/21 职场文书
贫民窟的百万富翁观后感
2015/06/09 职场文书
小学生读书笔记范文
2015/06/30 职场文书
Pandas 数据编码的十种方法
2022/04/20 Python