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在IE和FF下attachEvent,addEventListener学习笔记
Nov 26 Javascript
JQUERY实现左侧TIPS滑进滑出效果示例
Jun 27 Javascript
浅谈Javascript变量作用域问题
Dec 16 Javascript
JavaScript函数的调用以及参数传递
Oct 21 Javascript
JS获取浮动(float)元素的style.left值为空的快速解决办法
Feb 19 Javascript
Vue.js手风琴菜单组件开发实例
May 16 Javascript
BootStrap selectpicker后台动态绑定数据
Jun 01 Javascript
详解jQuery同步Ajax带来的UI线程阻塞问题及解决办法
Aug 09 jQuery
Vue中组件之间数据的传递的示例代码
Sep 08 Javascript
vue3.0 CLI - 3.2 路由的初级使用教程
Sep 20 Javascript
详解elementUI中input框无法输入的问题
Apr 27 Javascript
react组件基本用法示例小结
Apr 27 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
Smarty安装配置方法
2008/04/10 PHP
Codeigniter实现多文件上传并创建多个缩略图
2014/06/12 PHP
PHP中生成UUID自定义函数分享
2015/06/10 PHP
对PHP依赖注入的理解实例分析
2016/10/09 PHP
禁止js文件缓存的代码
2010/04/09 Javascript
常用一些Javascript判断函数
2012/08/14 Javascript
javascript中expression的用法整理
2014/05/13 Javascript
jQuery+ajax实现动态执行脚本的方法
2015/01/27 Javascript
jQuery插件StickUp实现网页导航置顶
2015/04/12 Javascript
js脚本分页代码分享(7种样式)
2015/08/19 Javascript
bootstrap网页框架的使用方法
2016/05/10 Javascript
详解node.js搭建代理服务器请求数据
2017/04/08 Javascript
vue.js移动端app实战1:初始配置详解
2017/07/24 Javascript
Vue cli+mui 区域滚动的实例代码
2018/01/25 Javascript
Angular路由ui-router配置详解
2018/08/01 Javascript
angularjs手动识别字符串中的换行符方法
2018/10/02 Javascript
基于vue实现圆形菜单栏组件
2019/07/05 Javascript
关于layui导航栏不展示下拉列表的解决方法
2019/09/25 Javascript
微信小程序中weui用法解析
2019/10/21 Javascript
JavaScript多种滤镜算法实现代码实例
2019/12/10 Javascript
js判断一个对象是数组(函数)的方法实例
2019/12/19 Javascript
Element Collapse 折叠面板的使用方法
2020/07/26 Javascript
Vue检测屏幕变化来改变不同的charts样式实例
2020/10/26 Javascript
python自动翻译实现方法
2016/05/28 Python
python机器人行走步数问题的解决
2018/01/29 Python
python生成器,可迭代对象,迭代器区别和联系
2018/02/04 Python
python读取并定位excel数据坐标系详解
2019/06/26 Python
Pytorch Tensor的统计属性实例讲解
2019/12/30 Python
一篇文章带你搞定Ubuntu中打开Pycharm总是卡顿崩溃
2020/11/02 Python
公司联欢晚会主持词
2014/03/22 职场文书
竞选班干部演讲稿100字
2014/08/20 职场文书
员工辞职信怎么写
2015/02/27 职场文书
建筑质检员岗位职责
2015/04/08 职场文书
2015年财务人员工作总结
2015/04/10 职场文书
PC版《死亡搁浅导剪版》现已发售 展开全新的探险
2022/04/03 其他游戏
Python 一键获取电脑浏览器的账号密码
2022/05/11 Python