基于ThinkPHP实现批量删除

下面是详细讲解“基于ThinkPHP实现批量删除”的完整攻略。

下面是详细讲解“基于ThinkPHP实现批量删除”的完整攻略。

背景

在一些网站或系统中,我们经常需要批量删除某些数据,如果手动一个一个删除,效率很低,而且容易出错。因此,我们需要实现一个批量删除的功能,来提高效率和降低错误率。本文将会以ThinkPHP为例,来讲解如何实现这个功能。

思路

具体的思路如下:

  1. 首先需要在前端页面上搭建一个删除按钮,勾选要删除的数据后,点击删除按钮发送请求到服务器端。
  2. 服务端接收到请求后,对勾选的数据进行批量删除。

实现步骤

步骤一:前端页面设计

首先,在前端页面中,我们需要设计一个删除按钮和一个勾选所有数据的复选框,然后通过ajax将选择的数据的id发送给服务端。HTML代码示例:

<table>
  <thead>
    <tr>
      <th><input type="checkbox" id="selectAll"/></th>
      <th>编号</th>
      <th>名称</th>
      <th>操作</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td><input type="checkbox" class="ids" value="1"></td>
      <td>1</td>
      <td>用户1</td>
      <td><a href="#">编辑</a></td>
    </tr>
    <tr>
      <td><input type="checkbox" class="ids" value="2"></td>
      <td>2</td>
      <td>用户2</td>
      <td><a href="#">编辑</a></td>
    </tr>
    <tr>
      <td><input type="checkbox" class="ids" value="3"></td>
      <td>3</td>
      <td>用户3</td>
      <td><a href="#">编辑</a></td>
    </tr>
  </tbody>
  <tfoot>
    <tr>
      <td colspan="4"><a href="#" id="delAll">删除</a></td>
    </tr>
  </tfoot>
</table>

<script>
  // 全选/全不选
  $('#selectAll').click(function(){
    $('.ids').prop('checked', $(this).is(':checked'));
  });

  // 批量删除
  $('#delAll').click(function(){
    var ids = [];
    $('.ids:checked').each(function(){
      ids.push($(this).val());
    });

    if(ids.length === 0){
      alert('请选择要删除的用户!');
      return;
    }

    if(confirm('确定要删除所选用户吗?')){
      $.ajax({
        url: "/user/delAll",
        data: {ids: ids},
        type: "POST",
        dataType: "json",
        success: function(json){
          if(json.code === 1){
            alert('删除成功!');
            window.location.reload();
          } else {
            alert('删除失败!');
          }
        }
      });
    }
  });
</script>

在上面的代码中,我们首先定义了一个表格,表格中包含了复选框、编号、名称和操作四列。其中,复选框用来选择要删除的数据,编号和名称用来展示数据,操作列中包含了编辑按钮。

javascript中,我们实现了以下功能:

  1. 全选/全不选:当我们勾选全选框时,将所有数据的复选框勾上;当我们取消全选框勾选时,将所有数据的复选框取消勾选。
  2. 批量删除:当我们点击删除按钮时,首先获取所有被勾选的数据的id,并将这些id发送给服务器端。如果没有勾选任何数据,则弹出提示框;如果勾选了数据,则弹出确认框,用户点击确认后将数据发送给服务器端进行删除操作。如果删除成功,则刷新页面,如果删除失败,则弹出提示框。

步骤二:服务端实现

在服务端,我们需要实现一个delAll方法来处理批量删除请求。具体实现代码如下:

class User extends Controller
{
  public function delAll()
  {
    $ids = input('ids');

    if(empty($ids)){
      return ['code' => 0, 'msg' => '请选择要删除的数据!'];
    }

    $model = model('User');
    if($model->destroy($ids)){
      return ['code' => 1, 'msg' => '删除成功!'];
    } else {
      return ['code' => 0, 'msg' => '删除失败!'];
    }
  }
}

在上述代码中,我们首先接收前端传来的ids参数,判断这个参数是否为空;如果为空,则返回删除失败的消息。如果ids不为空,则调用Model的destroy方法进行批量删除操作,如果删除成功,则返回删除成功的消息,否则返回删除失败的消息。

示例

下面是两种实例说明。

示例一:删除单条数据

假设我们现在有一条数据,编号为1,名字为张三,我们需要删除这条数据。想要实现这个功能,只需要打开这条数据的编辑页面,然后在底部点击“删除”按钮即可。

示例二:删除多条数据

假设我们现在有三条数据,分别是1. 张三,2. 李四,3. 王五,我们需要将其中的张三、王五这两条数据删除。这时,我们可以在数据列表页面中,勾选这两条数据的复选框,并点击“删除”按钮即可。

结论

通过本文的讲解,我们知道了如何基于ThinkPHP框架实现批量删除功能。在前端页面中,我们需要设计一个删除按钮和一个勾选所有数据的复选框,然后通过Ajax将选择的数据的id发送给服务端。在服务端,我们需要实现一个delAll方法来处理批量删除请求。在处理完请求后,需要将成功或者失败的消息返回给前端。

本文标题为:基于ThinkPHP实现批量删除

基础教程推荐