zoukankan      html  css  js  c++  java
  • 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">
                                        &times;
                                    </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";
        }
    }

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

  • 相关阅读:
    CentOS7 安装 MySQL 5.7
    Centos7 安装 opencv
    nginx编译支持HTTP2.0
    CentOS 6.5 安装 ffmpeg
    parted 4T磁盘
    nginx upstream
    linux rar 解压忽略带密码压缩包
    那些实用的Nginx规则
    linux 两台服务器共享目录NFS实现
    redis集群搭建
  • 原文地址:https://www.cnblogs.com/xiaodouding/p/6868415.html
Copyright © 2011-2022 走看看