1、Html代码,将所有CheckBox包含于删除表单,并且所有列表项的CheckBox使用相同的Name,并且Value设置为数据项主键ID

 @using (Html.BeginForm("Delete", null, FormMethod.Post, new { id = "DeleteForm" }))
 {
     @Html.AntiForgeryToken()
     <div id="table-scrollable" class="table-scrollable">
         <table class="table table-striped table-hover table-border-top">
             <thead>
                 <tr>
                     <th class="table-checkbox">
                         <input id="checkall" type="checkbox" class="group-checkable" />
                     </th>
                     <th>序号</th>
                     <th>
                         其它数据
                     </th>
                 </tr>
             </thead>
             <tbody>
                 @{ ;}
                 @foreach (var item in Model) {
                     <tr>
                         <td>
                             <input name="guids" type="checkbox" class="checkboxes" value="@item.GUID" />
                         </td>
                         <td>@(Model.StartItemIndex + i++)</td>
                         <td>
                             其它数据
                         </td>
                     </tr>
                 }
             </tbody>
         </table>
     </div>
 }

2、JS脚本,主要用于操作表头进行全选和取消全选,此处需注意,存在分页情况时,全选操作只针对当前页的列表项,不能选择未展示的数据;

 //表头CheckBox操作全选或取消全选
 $("#checkall").click(function () {
     var ischecked = this.checked;
     $("input:checkbox[name='guids']").each(function () {
         this.checked = ischecked;
     });
 });

同时,JS也负责表单提交前进行弹窗提醒,此处使用的是bootbox控件弹出提示窗,也可以使用其它弹窗组件

 $("#delete").click(function () {
     ;
     $("input:checkbox[name='guids']").each(function () {
         if (this.checked) count++;
     });
     ) {
         bootbox.dialog({
             size: "small",
             onEscape: "true",
             message: "你确定要批量删除勾选的 " + count + " 条记录吗?",
             title: "操作确认",
             buttons: {
                 OK: {
                     label: " 确定 ",
                     className: "red-haze fa fa-check ",
                     callback: function () {
                         $("#DeleteForm").submit();
                     }
                 },
                 Cancel: {
                     label: " 取消 ",
                     className: "green-jungle fa fa-times ",
                     callback: function () {
                     }
                 }
             }
         });
     }
     else {
         bootbox.dialog({
             size: "small",
             onEscape: "true",
             message: "请先选择你要删除的记录!",
             title: "操作提示",
             buttons: {
                 OK: {
                     label: " 确定 ",
                     className: "green-jungle fa fa-bell-o",
                     callback: function () {
                     }
                 }
             }
         });
     }
 });

3、Controller代码,通过List类型接收同名的表单数据项

         [HttpPost]
         [ValidateAntiForgeryToken]
         public ActionResult Delete(List<Guid> guids)
         {
             )
             {
                 db.TargetTable.Where(x => guids.Contains(x.GUID)).ToList().ForEach(x =>
                 {
                         db.TargetTable.Remove(x);
                 });
                 db.SaveChanges();
             }

             return Redirect(Request.UrlReferrer.ToString());
         }    

MVC列表页通过CheckBox进行批量选择删除的更多相关文章

  1. PHP+MySql+Bootstrap实现用户界面数据的删除、修改与批量选择删除——实例操作

    第一步:在数据库中建立要操作的信息表 如下图: 第二步:实现对该信息表中数据的删除功能 代码如下:main(主页面) <!DOCTYPE html><html>    < ...

  2. Android开发之ListView条目批量选择删除

    ListView实现的列表,假设是可编辑,可删除的,一般都要提供批量删除功能,否则的话,一项一项的删除体验非常不好,也给用户带来了非常大的麻烦. 实现效果图 详细实现代码 select.xml 主布局 ...

  3. 更好列表页中一个航班.先unset删除数组中一个键值对,再追加,最后按键排序

    <?php $arr = array( '0' => array('item' => array( 'aa' => 'aaa', 'bb' => 'bbb' )), '1 ...

  4. Asp.net MVC 3实例学习之ExtShop(四)——完成产品列表页

    在完成产品列表页前要做一些准备功夫.首先是去下载MvcPager用了为产品列表分页.下载的可能是基于MVC 2的,没关系,可以用在MVC 3上.如果有担心,下载源代码重新编译一次好了.下载后将DLL添 ...

  5. python实现列表页数据的批量抓取练手练手的

    python实现列表页数据的批量抓取,练手的,下回带分页的 #!/usr/bin/env python # coding=utf-8 import requests from bs4 import B ...

  6. 通过angularjs的directive以及service来实现的列表页加载排序分页

    前两篇:(列表页的动态条件搜索,我是如何做列表页的)分别介绍了我们是如何做后端业务系统数据展示类的列表页以及动态搜索的,那么还剩下最重要的一项:数据展示.数据展示一般包含三部分: 数据列头 数据行 分 ...

  7. 夺命雷公狗ThinkPHP项目之----企业网站18之网站配置列表页的完成

    我们点击下配置列表即可查看我们列表页的配置信息了: 其实这个最简单了,首先我们先来完成他控制器的代码: public function lists(){ $mod = M('Conf')->se ...

  8. 通过angularjs的directive以及service来实现的列表页加载排序分页(转)

    前两篇:(列表页的动态条件搜索,我是如何做列表页的)分别介绍了我们是如何做后端业务系统数据展示类的列表页以及动态搜索的,那么还剩下最重要的一项:数据展示.数据展示一般包含三部分: 数据列头 数据行 分 ...

  9. Golang在京东列表页实践总结

    Golang在京东列表页实践总结 作者:张洪涛 10余年软件开发和设计经验,曾就职于搜狐.搜狗.前matrixjoy公司联合创始人.甘普科技CTO. 目前线上状态 基于搜索实现: 全量数据,搜索结果不 ...

随机推荐

  1. Word中字体背景有白块咋办

      如下图,主要是从新浪博客贴过来的,先用记事本很麻烦. 1. 记事本转帖,麻烦,有公式的话需要单独处理,更麻烦 2.菜单栏中的油漆桶(段落那),有时候不行. 3.粘到QQ对话框再占回来,完美. 4. ...

  2. 剑指offer--7题

    *题目:输入一个英文句子,翻转句子中单词的顺序,但单词内字符的顺序不变. *句子中单词以空格符隔开.为简单起见,标点符号和普通字母一样处理. *例如输入“I am a student.”,则输出“st ...

  3. 2014 ACM/ICPC Asia Regional Shanghai Online

    Tree http://acm.hdu.edu.cn/showproblem.php?pid=5044 树链剖分,区间更新的时候要用on的左++右--的标记方法,要手动扩栈,用c++交,综合以上的条件 ...

  4. CSS字体选择问题

    在西方国家的字母体系,分成两大字族:serif 及 sans serif.其中 typewriter 打字机字体,虽然也是 sans serif,但由于他是等距字,所以另独立出一个 Typewrite ...

  5. MyEclipse提示键配置、提示快捷键、提示背景色、关键字颜色、代码显示、编...

    1.提示键配置 一般默认情况下,Eclipse ,MyEclipse 的代码提示功能是比Microsoft Visual Studio的差很多的,主要是Eclipse ,MyEclipse本身有很多选 ...

  6. 1051: [HAOI2006]受欢迎的牛

    1051: [HAOI2006]受欢迎的牛 Time Limit: 10 Sec  Memory Limit: 162 MBSubmit: 2276  Solved: 1190[Submit][Sta ...

  7. (转)Engineering Productivity

    (转)http://www.wandoujia.com/blog/from-qa-to-ep 这个文章之前读过,很不错.今天再读,有不一样的感受!推荐下. 下面是几段摘录: EP 是什么 说到这里,E ...

  8. Linux中yum和apt-get用法及区别

    Linux中yum和apt-get用法及区别   一般来说著名的linux系统基本上分两大类:   1.RedHat系列:Redhat.Centos.Fedora等   2.Debian系列:Debi ...

  9. Sqli-labs less 26

    Less-26 TIPS:本关可能有的朋友在windows下无法使用一些特殊的字符代替空格,此处是因为apache的解析的问题,这里请更换到linux平台下. 本关结合25关,将空格,or,and,/ ...

  10. DF学Mysql(三)——索引操作

    概要: 数据库对象索引其实与书的目录非常相似,主要是为了提高从表中检索数据的速度. 由于数据存储在数据库表中,所以索引是创建在数据库表对象上的,由表中的一个字段或多个字段生成的键组成,这些键存储在数据 ...