关于jquery全选反选 批量删除的一点心得详解编程语言

废话不多说直接上代码:

下面是jsp页面的html代码:

<table id="contentTable" class=""> 
        <thead> 
            <tr>  
            <th><input type="checkbox" id="All" value="全选/全不选" />全选/全不选</th>  
            </tr> 
        </thead> 
        <tbody> 
        <c:forEach items="${page.list}" var="advAdvertisement"> 
            <tr> 
                <td><input type="checkbox" value="${advAdvertisement.id}" name="checkbox" class="checkbox"/></td> 
            </tr> 
        </c:forEach> 
        </tbody> 
    </table>

然后是jquery:

  
        $(document).ready(function(){ 
             
            $('#All').change(function(){ 
                 
            if($('#All').attr('checked')){ 
             
                $('.checkbox').attr('checked',true); 
                 
            }else{ 
                $('.checkbox').removeAttr('checked'); 
            } 
                 
            }); 
        });

 

代码简单明了,相信聪明的你一看就懂。

最后是批量删除选中的复选框数据:

<input id="btnSubmit" class="" onclick="deleteAll();" type="button" value="批量删除"/> 
 
<script type="text/javascript"> 
         
        function deleteAll(){ 
            if(confirm('确认要删除选中的广告吗?')==true){ 
                 
            var obj=document.getElementsByName('checkbox'); //选择所有name="'test'"的对象,返回数组  
            //取到对象数组后,我们来循环检测它是不是被选中  
            var s=new Array();  
            for(var i=0; i<obj.length; i++){  
            if(obj[i].checked){ 
                s[i]=obj[i].value; 
            } //如果选中,将value添加到数组s中  
            }  
            //那么现在来检测s的值就知道选中的复选框的值了  
            alert(s==''?'你还没有选择任何内容!':s); 
            alert(s); 
            $.ajax({ 
                  type:'POST', 
                  url:'${ctx}/adv/advAdvertisement/deleteAll', 
                  data:{'ids':s}, 
                  traditional:true, 
                  dataType:'text', 
                  success:function(data){alert('删除成功!')} 
            }); 
            window.location.href=""; 
            } 
        } 
    </script>

批量删除的时候需要去获取每一个被选中的复选框的id,我们用一个数组把他们存起来,最重要的一点,是要在$.ajax中配置traditional:true这个属性,如果不配置后台controller是不认可的。

 

后台接收的话直接用一个String[] ids数组接收就可以得到关于id的一个数组了,然后for循环尽情的做你想做的一切吧!

 

批量删除的话用 where in 语句比较合适:

    <update id="deleteAll" parameterType="java.util.Arrays"> 
 
    UPDATE test_data SET  
    del_flag = 1 
    where id in 
 
    <foreach item="idItem" collection="array" open="(" separator="," 
      close=")"> 
 
      #{idItem} 
 
    </foreach> 
 
  </update>

 

原创文章,作者:Maggie-Hunter,如若转载,请注明出处:https://blog.ytso.com/11501.html

(0)
上一篇 2021年7月19日
下一篇 2021年7月19日

相关推荐

发表回复

登录后才能评论