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 相关文章推荐
几个比较经典常用的jQuery小技巧
Mar 01 Javascript
javascript级联下拉列表实例代码(自写)
May 10 Javascript
基于jquery实现省市区三级联动效果
Dec 25 Javascript
jQuery ajax应用总结
Jun 02 Javascript
jQuery Validate插件自定义验证规则的方法
Dec 27 Javascript
详解jquery validate实现表单验证 (正则表达式)
Jan 18 Javascript
node操作mysql数据库实例详解
Mar 17 Javascript
vue.js事件处理器是什么
Mar 20 Javascript
JS实现的简单四则运算计算器功能示例
Sep 27 Javascript
js实现简单数字变动效果
Nov 06 Javascript
swiper.js插件实现pc端文本上下滑动功能示例
Dec 03 Javascript
详解Vue 数据更新了但页面没有更新的 7 种情况汇总及延伸总结
May 28 Javascript
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数组应用之比较两个时间的相减排序
2008/08/18 PHP
php 根据url自动生成缩略图并处理高并发问题
2014/01/23 PHP
php分页代码学习示例分享
2014/02/20 PHP
PHP模板引擎Smarty自定义变量调解器用法
2016/04/11 PHP
对于Laravel 5.5核心架构的深入理解
2018/02/22 PHP
JQuery读取XML文件数据并显示的实现代码
2009/12/16 Javascript
JS解析json数据并将json字符串转化为数组的实现方法
2012/12/25 Javascript
表单元素的submit()方法和onsubmit事件应用概述
2013/02/01 Javascript
jquery获取URL中参数解决中文乱码问题的两种方法
2013/12/18 Javascript
js实现对table动态添加、删除和更新的方法
2015/02/10 Javascript
Nodejs学习笔记之测试驱动
2015/04/16 NodeJs
js实现的早期滑动门菜单效果代码
2015/08/27 Javascript
js如何判断输入字符串长度
2015/12/16 Javascript
关于JavaScript和jQuery的类型判断详解
2016/10/08 Javascript
jQuery实现二维码扫描功能
2017/01/09 Javascript
React实现点击删除列表中对应项
2017/01/10 Javascript
使用cookie绕过验证码登录的实现代码
2017/10/12 Javascript
解决Vue 浏览器后退无法触发beforeRouteLeave的问题
2017/12/24 Javascript
vuex 解决报错this.$store.commit is not a function的方法
2018/12/17 Javascript
在 Vue 中使用 JSX 及使用它的原因浅析
2020/02/10 Javascript
JavaScript实现随机点名器
2020/03/25 Javascript
python实现代码行数统计示例分享
2014/02/10 Python
python使用pil生成图片验证码的方法
2015/05/08 Python
Python 实现「食行生鲜」签到领积分功能
2018/09/26 Python
Python数据类型之Dict字典实例详解
2019/05/07 Python
Python使用grequests(gevent+requests)并发发送请求过程解析
2019/09/25 Python
Python 日期的转换及计算的具体使用详解
2020/01/16 Python
Reebok官方旗舰店:美国知名健身品牌锐步
2019/01/07 全球购物
数控专业毕业生求职信范文
2013/09/21 职场文书
金融专业大学生职业生涯规划范文
2014/01/16 职场文书
服务生自我鉴定
2014/01/22 职场文书
校园环保建议书
2014/05/14 职场文书
农村文化活动总结
2014/08/28 职场文书
普通党员四风问题对照检查材料
2014/09/27 职场文书
免职证明样本
2014/10/23 职场文书
python将图片转为矢量图的方法步骤
2021/03/30 Python