php教程

超轻量级php框架startmvc

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

更新时间:2020-03-19 19:20:58 作者:startmvc
为了美观,我还是引入了bootstrap的模态框,我引入的是自己的数据库library中的一张表名为

为了美观,我还是引入了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结合写批量删除功能,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对脚本之家网站的支持!

php jquery ajax 批量删除