zoukankan      html  css  js  c++  java
  • 关于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>
  • 相关阅读:
    Junit单元测试
    win7的6个网络命令
    WOJ1024 (POJ1985+POJ2631) Exploration 树/BFS
    WOJ1022 Competition of Programming 贪心 WOJ1023 Division dp
    woj1019 Curriculum Schedule 输入输出 woj1020 Adjacent Difference 排序
    woj1018(HDU4384)KING KONG 循环群
    woj1016 cherry blossom woj1017 Billiard ball 几何
    woj1013 Barcelet 字符串 woj1014 Doraemon's Flashlight 几何
    woj1012 Thingk and Count DP好题
    woj1010 alternate sum 数学 woj1011 Finding Teamates 数学
  • 原文地址:https://www.cnblogs.com/fengwenzhee/p/7064124.html
Copyright © 2011-2022 走看看