当前位置: 首页 > 编程笔记 >

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

孙宏扬
2023-03-14
本文向大家介绍EasyUI实现二级页面的内容勾选的方法,包括了EasyUI实现二级页面的内容勾选的方法的使用技巧和注意事项,需要的朋友参考一下

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实现二级页面的内容勾选的方法,希望对大家能够有所帮助。

 类似资料:
  • 本文向大家介绍easyui 中的datagrid跨页勾选问题的实现方法,包括了easyui 中的datagrid跨页勾选问题的实现方法的使用技巧和注意事项,需要的朋友参考一下 easyui的datagrid分页显示数据,如果有需求要求勾选多条数据且不再同一页中,easyui会保存在其他页选中的数据吗? 一开始在网上查阅有人说easyui中没有此方法,需要自己写,但其实至少在1.4版本后只要在dat

  • 本文向大家介绍bootstrap-Treeview实现级联勾选,包括了bootstrap-Treeview实现级联勾选的使用技巧和注意事项,需要的朋友参考一下 本文实例为大家分享了bootstrap Treeview实现级联勾选的具体代码,供大家参考,具体内容如下 核心方法 6-27 : 经部分网友反馈,图中的 if(!("id" in perentNode)) 需要改成 if(!("nodeId

  • 本文向大家介绍ASP.NET抓取网页内容的实现方法,包括了ASP.NET抓取网页内容的实现方法的使用技巧和注意事项,需要的朋友参考一下 本文实例讲述了ASP.NET抓取网页内容的实现方法。分享给大家供大家参考。具体实现方法如下: 一、ASP.NET 使用HttpWebRequest抓取网页内容 二、ASP.NET 使用 WebResponse 抓取网页内容 希望本文所述对大家的C#程序设计有所帮助

  • 本文向大家介绍利用jqprint插件打印页面内容的实现方法,包括了利用jqprint插件打印页面内容的实现方法的使用技巧和注意事项,需要的朋友参考一下 业务场景 客户需要在页面有一个打印按钮,点击之后可以打印Echarts图表的内容以及文字提示信息,经谷歌搜索发现,实现方法大概有三种之多,其他两种不太熟悉,而采用的这种打印方式是一个在jQuery的基本上开发的一个print插件,因此可以使用jQu

  • 本文向大家介绍jQuery EasyUI datagrid实现本地分页的方法,包括了jQuery EasyUI datagrid实现本地分页的方法的使用技巧和注意事项,需要的朋友参考一下 本文实例讲述了jQuery EasyUI datagrid实现本地分页的方法。分享给大家供大家参考。具体如下: 一般分页都是后台做,前端做无论从哪方面考虑都不合适。但是有的时候还是有这种需求。 这里重点用到了pa

  • 本文向大家介绍Ajax方式实现定期更新页面某块内容的方法,包括了Ajax方式实现定期更新页面某块内容的方法的使用技巧和注意事项,需要的朋友参考一下 本文实例讲述了Ajax方式实现定期更新页面某块内容的方法。分享给大家供大家参考。具体实现方法如下: 希望本文所述对大家的Ajax程序设计有所帮助。