EasyUI-DataGrid之批量删除

简单介绍一下,涉及到的几个知识点:

     1.checkbox,多选

     2.前台到后台传值,我用的是字符串拼接,到了后台在拆分的方式

     3.批量删除的底层实现

 

效果图

                

 

 

前台view

[html] view plain copy
 
 print?在CODE上查看代码片派生到我的代码片
  1. <table id="list_data" class="easyui-datagrid" style="width:1075px;height:300px" cellpascing="0" cellpadding="0"    ></table>   

 

[javascript] view plain copy
 
 print?在CODE上查看代码片派生到我的代码片
  1. $(function () {  
  2.             $('#dg').datagrid({  
  3.                 title: '查询结果',  
  4.                 iconCls: 'icon-view', //图标  
  5.                 width: 100,  
  6.                 height: 'auto',  
  7.                 nowrap: false,  
  8.                 striped: true,  
  9.                 border: true,  
  10.                 collapsible: true, //是否可折叠  
  11.                 fit: true, //自动大小  
  12.                 url: "/EvaluationTemplate/GetData", //传值  
  13.                 remoteSort: false,             
  14.                 pagination: false,  //分页控件  
  15.                 rownumbers: false,  //行号  
  16.                 singleSelect: false, //允许选择多行  
  17.                 selectOnCheck: true,//true勾选会选择行,false勾选不选择行, 1.3以后有此选项。重点在这里  
  18.                 checkOnSelect: true, //true选择行勾选,false选择行不勾选, 1.3以后有此选项             
  19.                 columns: [[  
  20.                      { field: 'ck', checkbox: true, width: '30' },  //复选框  
  21.                      { field: 'TemplateName', title: '模板名称', width: '100' },  //课程类型名称  
  22.                 ]],  
  23.   
  24.             });  
  25.   
  26.         });  

 

[javascript] view plain copy
 
 print?在CODE上查看代码片派生到我的代码片
  1. function deletedata() {  
  2.         //返回选中多行  
  3.         var selRow = $('#dg').datagrid('getSelections')  
  4.         //判断是否选中行  
  5.         if (selRow.length==0) {  
  6.             $.messager.alert("提示", "请选择要删除的行!", "info");  
  7.             return;  
  8.         }else{      
  9.             var temID="";  
  10.             //批量获取选中行的评估模板ID  
  11.             for (i = 0; i < selRow.length;i++) {  
  12.                 if (temID =="") {  
  13.                     temID = selRow[i].TemplateId;  
  14.                 } else {  
  15.                     temID = selRow[i].TemplateId + "," + temID;  
  16.                 }                 
  17.             }  
  18.                         
  19.             $.messager.confirm('提示', '是否删除选中数据?', function (r) {  
  20.   
  21.                 if (!r) {  
  22.                     return;  
  23.                 }  
  24.                 //提交  
  25.                 $.ajax({  
  26.                     type: "POST",  
  27.                     async: false,  
  28.                     url: "/EvaluationTemplate/DelTem?id=" + temID,  
  29.                     data: temID,  
  30.                     success: function (result) {  
  31.                         if (result.indexOf("t") <= 0) {  
  32.                             $('#dg').datagrid('clearSelections');  
  33.                             $.messager.alert("提示", "恭喜您,信息删除成功!", "info");  
  34.                             $('#dg').datagrid('reload');  
  35.                         } else {  
  36.                             $.messager.alert("提示", "删除失败,请重新操作!", "info");  
  37.                             return;  
  38.                         }  
  39.                     }  
  40.                 });  
  41.             });  
  42.   
  43.         }  
  44.     };  



 

 

解说:根据本篇博客性质,所以,大家重点看

 “  selectOnCheck:true,//true勾选会选择行,false勾选不选择行, 1.3以后有此选项。重点在这里

                checkOnSelect: true,//true选择行勾选,false选择行不勾选,1.3以后有此选项        ”这两行代码。听着挺绕,其实就是复选框和选中行的颜色一致。一旦选中,复选框和具体某一行都变。

还有循环写入选中行的模板ID,主要利用选中行,getselections的属性,获取个数,循环写入。

 

 

Controller.cs

[csharp] view plain copy
 
 print?在CODE上查看代码片派生到我的代码片
  1.  #region 删除模板  
  2.         /// <summary>  
  3.         /// 删除模板,批量删除,返回值是布尔值  
  4.         /// </summary>  
  5.         /// <returns>返回值是布尔值</returns>  
  6.         public bool DelTem()  
  7.         {  
  8.             
  9.             //从前台获取字符串拼接,在这里先不转换成数组  
  10.             String strTemId= Request.QueryString["id"].ToString();  
  11.             bool bltem = template.DelTemplate(strTemId);  
  12.             return bltem;  
  13.   
  14.         }  
  15. #endregion  

 

解说:controller在这里只是作为一个数据传输的纽带。

 

服务端

[csharp] view plain copy
 
 print?在CODE上查看代码片派生到我的代码片
  1. //拆分字符串,放入数组中  
  2.  string[] strTemplateId = strTemplateIdAll.Split(',');  
  3.  #region 根据条件删除 void DelBy(Expression<Func<T, bool>> delWhere)  
  4.         /// <summary>  
  5.         /// 根据条件删除  
  6.         /// </summary>  
  7.         /// <param name="delWhere">删除条件</param>  
  8.         public void DelBy(Expression<Func<T, bool>> delWhere)  
  9.         {  
  10.             //1查询要删除的数据  
  11.             List<T> listDeleting = MyBaseDbContext.Set<T>().Where(delWhere).ToList();  
  12.             //2将要删除的数据 用删除方法添加到 EF 容器中  
  13.             listDeleting.ForEach(u =>  
  14.             {  
  15.                 MyBaseDbContext.Set<T>().Attach(u);//先附加到 EF容器  
  16.                 MyBaseDbContext.Set<T>().Remove(u);//标识为 删除 状态  
  17.             });  
  18.         }  
  19.         #endregion  

解说:依旧是底层类库,底层使用EF,涉及到lambda表达式,批量删除实现原理都是一样的,具体实现自己来做吧。

posted @ 2016-03-25 14:21  怪盗基德jack  阅读(1492)  评论(0编辑  收藏  举报