數據列表的全選、反選以及批量操作

html部分代碼：
1、全選的checkbox： <input type="checkbox" value="" id="all_columnId">
2、每條數據前邊的checkbox:<input type="checkbox" name="columnId" class="chrId" value="<% $Item.Id %>">

js代碼部分：
全選與反選：
$("#all_columnId").on("click", function(){
if (this.checked) {
$("[name=columnId]:checkbox").prop("checked", this.checked);
//有模板才顯示刪除按鈕
var check_value = [];
$("input[name=‘columnId‘]:checked").each(function(){
check_value.push($(this).val());
});
console.log(check_value);
check_value = $.grep(check_value, function(n){
return $.trim(n).length > 0;
});
if(check_value.length > 0){
$("#batch_del_fields").show();
}
}else{
$("[name=columnId]:checkbox").prop("checked", this.checked);
$("#batch_del_fields").hide();
}
});
$(".table").on("click","input[name=‘columnId‘]",function(){
var check_value = [];
$("input[name=‘columnId‘]:checked").each(function(){
check_value.push($(this).val());
});
console.log(check_value);
check_value = $.grep(check_value, function(n){
return $.trim(n).length > 0;
});
var $columnId = $("input[name=‘columnId‘]");
if(check_value.length > 0){
$(‘#batch_del_fields‘).show();
}else{
$(‘#batch_del_fields‘).hide();
}
$("#all_columnId").prop("checked",$columnId.length == $columnId.filter(":checked").length ? true : false);
});

操作部分：一般是批量刪除、批量審核等
$("#batch_del_fields").click(function(){
//獲取選中的
var check_value = [];
$("input[name=‘columnId‘]:checked").each(function(){
check_value.push($(this).val());
});
//check_value就是選中的部分，數組形式
console.log(check_value);
//在這下邊執行異步刪除等操作
});

數據列表的全選、反選以及批量操作