Ajax复选框多选删除的实现

AJAX多选删除的思路是通过控制器从后台删除数据，然后前台的数据是不会刷新的，我们需要用jQuery把前台的数据也删掉。

首先，引用jquery

[html] view plain copy print ?

1. <script src="{{asset('lib/js/jquery-2.0.3.min.js')}}"></script>  

然后，写出一个个的复选框，其中之一是这样

[html] view plain copy print ?

1. ...   
2. <tr>  
3.                                 <td><input type="checkbox" name="chk" class="chk" value="{{$c->id}}"></td>  
4.                                 <td>{{$c->user->name}}</td>  
5. </tr>  
6. ...  

接着，写出全选/反选功能和删除按钮

[html] view plain copy print ?

1. <input type="checkbox" name="allcheck" id="all" value="0">  
2. <input type="submit" class="btn btn-danger" id='deletesome' value="删除选中">  
3. <input type="hidden" name="delete" id='delete' value=""> //他负责存放勾选的复选框中的VALUE  

最后，我们来写JS，这里是多选删除

[javascript] view plain copy print ?

1. $(function(){  
2.     $("#deletesome").click(function(){  
3.   
4.         $.ajax({  
5.                 url:"/deletesuggestionsajax",  
6.                 type:"get",  
7.                 dataType:"json",  
8.                 data:"delete="+$(this).next().val(),  
9.                 success:function(data){  
10.                     if(data.status == 1){  
11.                        $(":checked").parent().parent().remove(); //删除所有选中的，用的时候注意删除对象的正确选择  
12.   
13.                     }else{  
14.                         alert('系统故障');  
15.                     }  
16.   
17.                 }  
18.         });  
19.   
20.     });  
21.       
22. })  

这里是单个的删除，就是在每条后面跟个删除按钮，那时候用这个

[html] view plain copy print ?

1. $(function(){  
2.     $(".ajaxdelete").click(function(){  
3.         // console.log($(this).next().val());  
4.         var me=this;    //先做个闭包，否则在success里不能用$(this)  
5.   
6.         $.ajax({  
7.                 url:"/deletesuggestionajax",  
8.                 type:"get",  
9.                 dataType:"json",  
10.                 data:"id="+$(this).next().val(),  
11.                 success:function(data){  
12.                     if(data.status == 1){  
13.                         $(me).parent().parent().remove();  //删除当前的这个  
14.                     }else{  
15.                         alert('系统故障');  
16.                     }  
17.   
18.                 }  
19.         });  
20.   
21.     });  
22.       
23. })