1.实现全选
视图代码
批量删除按钮 <a href="javascript:;" onclick="datadelAll()">批量删除</a>
这是表格头 <th width="25"><input type="checkbox" name="" value="" id="check"></th>
这是主体 <td><input type="checkbox" value="{{$value->id}}" name="id[]"></td>
js代码
document.getElementById("check").onclick = function(){
var checked = document.getElementById("check").checked;
var checkson = document.getElementsByName("id[]");
if(checked){
for(var i = 0; i < checkson.length ;i++){
checkson[i].checked = true;
}
}else{
for(var i = 0; i < checkson.length ;i++){
checkson[i].checked = false;
}
}
}
2.ajax批量删除js代码
function datadelAll() {
// 询问框
layer.confirm('您是真的要删除选中的用户吗?', {
btn: ['确认删除', '思考一下']
}, function (){
// 选中的用户
let ids = $('input[name="id[]"]:checked');
// 删除的ID
let id = [];
// 循环
$.each(ids, (key, val) => {
//id.push($(val).val()); //$(val).val() dom对象 转为 jquery对象 $(dom对象)
id.push(val.value);
});
if (id.length > 0) {
// 发起ajax
$.ajax({
url: "{{ route('admin.delall') }}",
data: {id, _token}, //_token作用:Token 可以避免 CSRF 攻击
type: 'DELETE'
}).then(ret => {
if (ret.status == 0) {
layer.msg(ret.msg, {time: 1000, icon: 1}, function(){
location.reload();
})
}
})
}
});
}
3.控制器
public function delall(Request $request){
$ids=$request->get('id');
User::destroy($ids);
return ['status'=>0,'msg'=>'全部删除成功'];
}