gpt4 book ai didi

javascript - 如何通过一键删除按钮删除选中的项目

转载 作者:行者123 更新时间:2023-11-28 03:34:37 25 4
gpt4 key购买 nike

我想制作一个删除按钮来删除选中的项目。表示一键删除所有勾选的项目。我制作了一个主复选框来检查所有值。现在我想制作一个主按钮来删除选中的值。这是我的代码。我是 Laravel 的新手,请帮助我。对不起,我的英语不好。

@extends('footer')
@extends('header')

@section('body')
<!DOCTYPE html>
<html>
<head>
<title>Retrieve data|Std view</title>
<link rel="stylesheet" type="text/css" href="{{ asset('public/css/style.css') }}">
<link rel="stylesheet" type="text/css" href="{{ asset('public/css/bootstrap.css') }}">
<script type="text/javascript" src="{{ asset('public/js/jQuery.js') }}"></script>
</head>
<body>

@if(session()->has('success'))
<div class="alert alert-success">
<h3> {{ session()->get('success') }} </h3>
</div>

@endif

<div class="container">
<form action="" method="">
<input type="hidden" name="_token" value="<?php echo csrf_token(); ?>">

<h2 style="color: green">This Is View Form</h2>
<a href = "insert" class="btn btn-primary">Add New</a>

//HERE IS MY MASTER DELETE BUTTON.
<button type="submit" class="btn btn-danger" >Delete</button><br><br>


<table border="1" id="customers">
<tr>
<th>
//Here is my checkbox inside the loop.
<input type="checkbox" id="master" onchange="checkall(this);"> All
</th>
<th>Name</th>
<th>Email</th>
<th>Update</th>
<th>Delete</th>

</tr>

@foreach($data as $value)
<tr>

<td>
<input type="checkbox" class="sub_chk_{{ $value->id }}" value="{{ $value->id }}">
</td>
<td>{{ $value->name }}</td>
<td>{{ $value->email }}</td>
<td><a href="edit/{{$value->id}}" class="btn btn-primary" >Edit</a></td>

//THIS DELETE BUTTON FOR SINGLE DELETE FUNCTION

<td><a href="delete/{{$value->id}}" onclick='ConfirmDelete()' class="btn btn-danger" >Delete</a></td>
</tr>
@endforeach
</table>
</form><br>

{{ $data->links() }}

</div>

</body>

</html>
@endsection

<script>

function checkall(obj) {
var selectedIds = [];
if(obj.checked){
$('input:checkbox').not(obj).prop('checked', 'checked');
$("input:checkbox").each(function(){
var $this = $(this);

if($this.is(":checked")){
selectedIds.push($this.attr("value"));
console.log(selectedIds);
}
})
}
else{
$('input:checkbox').prop('checked',false);
}
}

function ConfirmDelete()
{
var x = confirm("Are you sure you want to delete?");
if (x)
return true;
else
event.preventDefault();
return false;
}


</script>

最佳答案

首先获取选中复选框的 id 数组,然后在 Controller 中使用这些 id 删除数据。首先为输入类型复选框指定名称(在 foreach 循环内),如下所示,

<input type="checkbox" name="ids[]" class="sub_chk_{{ $value->id }}"  value="{{ $value->id }}">

然后为表单操作创建新路由。然后在该 Controller 函数中编写删除数据的逻辑。就像,

function delete(Request $request){
Model::whereIn('id',$request['ids'])->delete();
}

就是这样。

关于javascript - 如何通过一键删除按钮删除选中的项目,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/57852206/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com