Bootstrap Table 删除和批量删除

一条记录可以看做一条数据的数组

1      Html

1.1  批量选择框

1.2  单个删除

2      bootStarp

2.1  批量获得

获得选择的数据

//批量删除
function deleteUserList() {
  //获取所有被选中的记录
  var rows = $("#user").bootstrapTable('getSelections');
  if (rows.length== 0) {
    alert("请先选择要删除的记录!");
    return;
  }
  var ids = '';
  for (var i = 0; i < rows.length; i++) {
    ids += rows[i]['id'] + ",";
  }
  ids = ids.substring(0, ids.length - 1);
  deleteUser(ids);
} 

2.2  单个获得

//单个删除
function deleteUserById(id) {
  deleteUser(id);
} 

2.3  公共操作

//删除
function deleteUser(ids) {
  var msg = "您真的确定要删除吗?";
  if (confirm(msg) == true) {
    $.ajax({
      url: "${path}/user/deleteUserList.do",
      type: "post",
      data: {
        ids: ids
      },
      success: function (data) {
        alert(data.msg);
        //重新加载记录
        //重新加载数据
        $("#user").bootstrapTable('refresh', {url: '/user/getUserList.do'});
      }
    });
  }
} 

3      Java

3.1  Controller

3.2  Service

public long deleteUserList(String ids) {
  String[] ss = ids.split(",");
  long count= 0;
  for (Strings : ss) {
    userResourceExtend.deleteUser(Integer.parseInt(s));
    count++;
  }
  return count;
} 

3.3  dao

总结

以上所述是小编给大家介绍的Bootstrap Table 删除和批量删除,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对我们网站的支持!

(0)

相关推荐

  • PHP实现登录注册之BootStrap表单功能

    前言 前面几篇简单介绍了一下前端与PHP的一些知识点,前端中表单提交是一个非常重要的模块,在本篇中我会介绍一些关于表单的知识,如果前面内容你掌握的不好并且没有大量的练习,我感觉你最好先把标签都记下来. 项目简介 登录与注册是我们在web开发中最常见的模块,也是我们日常生活中经常接触的功能.用户通过前端表单页面填写内容,通过POST方式提交到后台,然后经过PHP代码处理提交内容后,针对登录或者注册的逻辑继续操作. 登录与注册图解 BootStrap前端框架[ http://v3.bootcss.c

  • Bootstrap Table快速完美搭建后台管理系统

    Bootstrap Table是基于 Bootstrap 的 jQuery 表格插件,通过简单的设置,就可以拥有强大的单选.多选.排序.分页,以及编辑.导出.过滤(扩展)等等的功能:http://bootstrap-table.wenzhixin.net.cn/zh-cn/documentation/ 现在做的一个app管理以及后台配置系统,需要针对不同的城市作相应的定制化的配置,对一些后台数据也做一些展示和操作,所以每一个模块基本都会有表格的展现形式,这样做的好处就是直观方便操作.对于用什么t

  • 集合Bootstrap自定义confirm提示效果

    本文实例为大家分享了集合Bootstrap自定义confirm的具体代码,供大家参考,具体内容如下 效果 这里写图片描述 js端 var Common = { confirm:function(params){ var model = $("#common_confirm_model"); model.find(".title").html(params.title) model.find(".message").html(params.mess

  • BootStrap数据表格实例代码

    首先初始化页面 $(function(){ $('#archives-table').bootstrapTable({ url: "/coinSend/list",//数据源 dataField: "rows",//服务端返回数据键值 就是说记录放的键值是rows,分页时使用总记录数的键值为total search: true,//是否搜索 cache: false, striped: true, pagination: true,//是否分页 sortable:

  • bootstrap-table组合表头的实现方法

    最近需要做一个表格样式,需要组合表头,现在把做出来的分享给大家,  1.效果图 2.html代码 <table id="table"></table> 3.javascript代码 $("#table").bootstrapTable({ dataType: "json", method: 'get', contentType: "application/x-www-form-urlencoded",

  • BootStrap给table表格的每一行添加一个按钮事件

    1.在列属性中加入事件 { title:'数据量序号', field:'sjid' // hidden:true },{ field: 'operate', title: '操作', width: '80px', events: operateEvents, formatter: operateFormatter } 2.写一个函数 function operateFormatter(value, row, index) { return [ '<input type="submit&qu

  • 详解bootstrap用dropdown-menu实现上下文菜单

    详解bootstrap用dropdown-menu实现上下文菜单 写在前面: 所谓上下文菜单,它与一般菜单的区别在于: 通过右键触发显示在鼠标右键点击处 鼠标在别处点击后,该菜单消失 实现方法: 在html中定义一个普通的没有触发条件的dropdown-menu,然后写这个menu的父容器的监听即可实现. 代码: <div id="settingInGraph"> <ul class="dropdown-menu" role="menu&

  • ASP.NET MVC 使用Bootstrap的方法

    作为一名Web开发者而言,如果不借助任何前端框架,从零开始使用HTML和CSS来构建友好的页面是非常困难的.特别是对于Windows Form的开发者而言,更是难上加难. 正是由于这样的原因,Bootstrap诞生了.Twitter Bootstrap为开发者提供了丰富的CSS样式.组件.插件.响应式布局等.同时微软已经完全集成在ASP.NET MVC 模板中. Bootstrap结构介绍 你可以通过http://getbootstrap.com.来下载最新版本的Bootstrap. 解压文件夹

  • Bootstrap Table 删除和批量删除

    一条记录可以看做一条数据的数组 1      Html 1.1  批量选择框 1.2  单个删除 2      bootStarp 2.1  批量获得 获得选择的数据 //批量删除 function deleteUserList() { //获取所有被选中的记录 var rows = $("#user").bootstrapTable('getSelections'); if (rows.length== 0) { alert("请先选择要删除的记录!"); ret

  • BootStrap Table后台分页时前台删除最后一页所有数据refresh刷新后无数据问题

    主要是页码超出范围带来的问题,仅在此记录一下,这里我通过修改bootstrap-table.js的initServer方法中的查询success回调函数解决,将该回调函数改为: function (res) { /**TODO:2016-12-20新加的代码,处理页码错误问题开始*/ if(res.total!=0&&res.rows.length==0){//总记录数大于0,但当前页记录数为0,则此时页码超过了最大页码误 that.options.pageNumber = Math.ce

  • Vue实现单行删除与批量删除

    目录 单行删除与批量删除 一.单行删除 二.批量删除 简单的批量删除,全选删除 单行删除与批量删除 一.单行删除 <el-table-column align="center" fixed="right" label="操作" width="100"> <template slot-scope="scope"> <el-button type="text"

  • thinkphp框架实现删除和批量删除

    本文实例讲一下如何用thinkphp实现数据的删除和批量删除吧. 预期效果图: 原谅博主对照片的处理是如此的草率吧... 仍然是 通过MVC模式进行拆分: 首先是视图部分: <form action="__MODULE__/Admin/User/del" method="get"> <tr> <th width="4%"><input type="checkbox" name=&quo

  • JavaScript中全选、全不选、反选、无刷新删除、批量删除、即点即改入库(在yii框架中操作)的代码分享

    效果展示: 代码实现: 控制器 <?php namespace app\controllers; use Yii; use yii\filters\AccessControl; use yii\web\Controller; use yii\filters\VerbFilter; use app\models\LoginForm; use app\models\ContactForm; //use yii\db\ActiveRecord; use yii\data\Pagination; use

  • Oracle中多表关联批量插入批量更新与批量删除操作

    该文章会分为三部分 1.多表关联批量插入 2.多表关联批量更新 3.多表关联批量删除 首先要明白一点,为什么会有批量这一个概念,无非就是数据太多了,在java端把数据查出来然后在按照100-300的批次进行更新太耗性能了,而且写出来的代码会非常的臃肿,所谓好的实现是用最少的,最精简的代码实现需求,代码越少,留给自己犯错误的机会更少. 还有一个知识点就是多表关联,对于查询肯定是可以多表关联的,其实对于除了查询之外也是可以进行多表关联过滤数据的,从而达到在Oracle中查到目标数据即可更新,从而规避

  • ThinkPHP删除栏目(实现批量删除栏目)

    前段时间发表了一个删除栏目的随笔,当时实现的功能是删除一条信息,这次来实现一下批量删除栏目. 我们需要达到的是这样一个效果: 选中批量删除按钮后可以选中所有该页面的栏目,这个是前端页面的实现,在这里就不多说了,我们直接进入正题:批量删除的功能. 1.前端页面这里也有一个小小的点,就是选择框的name值应给给他赋值为一个id的数组,value值为该栏目的id. 2.我们在控制器中单独写一个批量删除的方法 public function privilege_bdel(){ $ids = I('ids

  • Angularjs+bootstrap+table多选(全选)支持单击行选中实现编辑、删除功能

    最终实现效果: index.html <!DOCTYPE html> <html> <head> <script src="//ajax.googleapis.com/ajax/libs/angularjs/1.5.8/angular.js"></script> <script src="//ajax.googleapis.com/ajax/libs/angularjs/1.5.8/angular-animat

  • BootStrap table删除指定行的注意事项(笔记整理)

    这里一定要做一个笔记,这个问题花了好几个小时,问题虽小,但是从中获得一定经验. 问题:对于table指定行的数据进行删除,仅仅是前端实现! 方法有两种: 1.使用官方文档的数据(反正我试了2个小时都不行,如有大神请指导下):使用events和operate相结合的方式 2.不使用events,在formatter里面定义事件的实现. 上面的例子只是一个细节点,bootstrap-table是一个基于Bootstrap的jQuery插件,可以实现从数据库中提取数据到前端进行相应操作的功能,很好用!

  • Bootstrap Table中的多选框删除功能

    先上代码,后面再进行详细解释: //删除按钮事件 $("#remove").on("click", function () { // $("#table").bootstrapTable('getSelections');为bootstrapTable自带的,所以说一定要使用bootstrapTable显示表格,#table:为table的id var rows = $("#table").bootstrapTable('ge

随机推荐