PHP jQuery+Ajax结合写批量删除功能

为了美观,我还是引入了bootstrap的模态框,我引入的是自己的数据库 library中的一张表 名为:maninfo表 是一张个人信息表

表的加载我就不写了,比较简单,  大概写一下需要的按钮和html部分就可以了

<button type="button" class="btn btn-primary"  id="plscdz" >批量删除</button>

全选:

<input type="checkbox" id="cq"/>

遍历出来的复选框为

<input type="checkbox" value="{$v[0]}" class="cq"/>

首先是全选按钮点击之后可以把遍历的复选框全部选中

<script type="text/javascript">
 $("#cq").click(function(){
$(".cq").prop("checked",$(this).prop("checked"));
})
</script>

这里我只写了一个简单的模态框

<div class="modal fade" id="myModal11" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
          <div class="modal-dialog">
            <div class="modal-content">
              <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-hidden="true">
                  ×
                </button>
                <h4 class="modal-title" id="myModalLabel">
                  提示
                </h4>
              </div>
              <div id="qrnr1" class="modal-body">
                您将删除选中的图书!
              </div>
              <div class="modal-footer">
                <button id="qxplsc" type="button" class="btn btn-default" data-dismiss="modal">取消删除</button>
                <button id="qrplsc" type="button" class="btn btn-primary">确认批量删除</button>
              </div>
            </div><!-- /.modal-content -->
          </div><!-- /.modal -->
        </div>
      </div>

这样前端的内容就完成了,这样就开始写js部分了,我全部用的是jquery

var chk = "";
  var check2 = "";
  //判断多个复选框中的某一个是否被实现
  function checked(){
    var count = 0;
    var checkx = $("#cq");
    if(checkx.checked)
    {
      check2=1;//选中全选按钮
    }
    else
    {
      check2=0;//没选中全选按钮
    }
    var checkArry = $(".cq");
    for (var i = 0; i < checkArry.length; i++)
    {
      if(checkArry[i].checked == true)
      {
        //选中的操作
        count++;
      }
    }
    if( count == 0 )
    {
      chk=0;//没有选中项
    }
    else
    {
      chk=1;//有选中项
    }
    //alert(chk);
  }
  function plscdzxx()
  {
    //批量删除
    $("#plscdz").click(function(){
      checked();
      if(chk==1 || check2==1){// 提交
        $('#myModal12').modal('show');
        $("#nqrplsc").click(function(){/*给确认删除按钮加事件*/
          $('#myModal12').modal('hide');
          //找选中的主键值,用循环遍历选中的主键值
          var cq =$(".cq");
          var plstr ="";
          for(var i=0;i<cq.length;i++)
          {
            if(cq.eq(i).prop("checked"))
            {
              plstr+=cq.eq(i).val()+"','";
            }
          }
          plstr= plstr.substr(0,plstr.length-3); //分隔符占3个字符,截取字符串,去掉最后的"','",这样正好匹配SQL语句
          $.ajax({
            async:false,
            url:"plscdz.php",
            data:{plstr:plstr},
            dataType:"TEXT",
            type:"POST",
            success:function(data){
              if(data.trim()=="OK")
              {
                alert("删除成功");
                nload();  //在这里要重新加载一遍页面
              }
              else
              {
                alert("删除失败");
              }
            }
          });
        });
      }
      else if(chk==0)
      {
        // 不提交
        //alert(chk);
        alert("请选择您要删除的内容");
      }
    })
  }

ajax会连接到批量删除的处理页面 ,下面就是批量删除的处理页面了

<?php
session_start();
include("DBDA.class.php");
$db = new DBDA();
if(!empty($_POST["plstr"]))
{
  $plstr = $_POST["plstr"];
  $sql = "delete from maninfo where id in ('{$plstr}')";
  if($db->Query($sql,0))
  {
    echo "OK";
  }
  else
  {
    echo "NO";
  }
}

写到这儿 如果您要是自己尝试的话,可能不运行,这就需要把批量删除的方法给调一下,前面有加载的方法的话,那就直接把批量删除的方法写到加载方法里面调用就可以了

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

(0)

相关推荐

  • JS实现复选框的全选和批量删除功能

    如图示: 功能描述:在勾选了全选时,所有的商品都会勾选,在取消全选时,取消所有物品的勾选.如果点击批量删除,删除所勾选的商品. <td align="center" width="12%" > <input type="checkbox" id="allChecks" onclick="ckAll()" /> 全选/全不选 </td> //全选 function ckAl

  • jquery ajax实现批量删除具体思路及代码

    js页面jquery代码: 复制代码 代码如下: // JavaScript Document $(document).ready(function() { // 全选 $("#allChk").click(function() { $("input[name='subChk']").prop("checked",this.checked); }); // 单选 var subChk = $("input[name='subChk']&

  • jsp Hibernate批量更新和批量删除处理代码

    以下程序直接通过Hibernate API批量更新CUSTOMERS表中年龄大于零的所有记录的AGE字段: tx = session.beginTransaction();Iterator customers=session.find("from Customer c where c.age>0").iterator();while(customers.hasNext()){Customer customer=(Customer)customers.next();customer

  • javaScript checkbox 全选/反选及批量删除

    前台代码 复制代码 代码如下: <script type="text/javascript"> var a; function CheckAll(){ if(a==1) { for(var i=0;i<window.document.form1.elements.length;i++) { var e = form1.elements[i]; e.checked =false; } a=0; } else { for(var i=0;i<window.docum

  • PHP jQuery+Ajax结合写批量删除功能

    为了美观,我还是引入了bootstrap的模态框,我引入的是自己的数据库 library中的一张表 名为:maninfo表 是一张个人信息表 表的加载我就不写了,比较简单,  大概写一下需要的按钮和html部分就可以了 <button type="button" class="btn btn-primary" id="plscdz" >批量删除</button> 全选: <input type="check

  • jQuery+Datatables实现表格批量删除功能【推荐】

    Datatables是一款jquery表格插件.它是一个高度灵活的工具,可以将任何HTML表格添加高级的交互功能. 最近遇到这样的需求要求把表格批量删除.下面通过实例代码给大家介绍下. 1:点击全选的选择框CheckBox,选中以下列表中所有的选择框 2:再次点击全选的选择框CheckBox,不选中以下列表中所有的选择框 3:单选某个选择框 如图所示: http://recordit.co/GLj5a5BWo9 简单代码demo: <thead> <tr role="row&q

  • jQuery+ajax实现批量删除功能完整示例

    本文实例讲述了jQuery+ajax实现批量删除功能.分享给大家供大家参考,具体如下: 效果展示: 完整代码如下: <!DOCTYPE html> <html lang="zh-CN"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <met

  • PHP ajax+jQuery 实现批量删除功能实例代码小结

    目录结构 piliangshan.php <?php require_once './db_conn.php'; $sql = "select * from user"; $result = mysqli_query($conn, $sql); ?> <html lang="zh-CN"> <head> <meta charset="UTF-8"> <title>全选演示</tit

  • java实现多选批量删除功能

    本文为大家分享了java实现多选批量删除的具体代码,帮助大家更好的理解批量删除功能的实现过程,供大家参考,具体内容如下 本文用到的框架是:springmvc+mybatis 实现思路:多选复选框多个删除,点击全选全部选中,再次点击全部取消,为了保证操作的安全,应该提示框进行提升,用户再次点击确认删除进行删除,把选中的多个复选框的值传到后端进行循环删除,最后刷新数据,公司中为了保证数据安全一般不会真正删除而是把数据修改状态进行隐藏,也就是修改,这边以完全删除为例 部分效果截图(页面简陋) 点击全选

  • vue+element+Java实现批量删除功能

    表格的主要代码段 主要方法是: @selection-change="selsChange <el-table ref="singleTable" v-loading="loading" :data="tableData" stripe @selection-change="selsChange"> <el-table-column type="selection" width=

  • vue+element的表格实现批量删除功能示例代码

    最近写了一个批量删除功能,遇到了不少坑,特此记录一下 表格的代码如下 复制代码 代码如下: <el-table @row-click="handleCurrentChange" @selection-change="selsChange" ref="table" :data="pageData" stripe :default-sort="{prop: 'createAt', order: 'descendin

  • js实现批量删除功能

    本文实例为大家分享了js实现批量删除功能的具体代码,供大家参考,具体内容如下 界面如下: 勾选复选框会自动记录id,设置value="id"即可 下面是全选操作(js): 其中开头的复选框的id为:delete_checkbox 下面记录条的复选框的name为:delete_checkbox if($("input[id='delete_checkbox']").is(':checked')==true){ $('input[name="delete_ch

  • jQuery+Ajax+PHP实现“喜欢”评级功能附源码下载

    本文章来给大家介绍一个jQuery+Ajax+PHP实现"喜欢"评级功能代码,用户点击页面中自己喜欢的图片上的红心按钮时,前端页面向后台发送一个ajax请求,后台PHP程序接收请求后,查询IP库中是否已经有该用户的点击记录,如果没有,则将对应的数值+1,同时将该用户IP信息写入IP库,反之则告诉用户已经"喜欢过了".  源码下载地址:http://xiazai.jb51.net/201509/yuanma/loveit(jb51.net).rar 实现过程 本文基于

  • PHP中使用jQuery+Ajax实现分页查询多功能操作(示例讲解)

    1.首先做主页面Ajax_pag.php 代码如下: <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Ajax做分页</title> <script src="bootstrap/js/jquery-1.11.2.min.js"></script> <script src="Ajax_

随机推荐