javascript - 如何将 Laravel 表中的多个复选框保存到数据库中?
问题描述
- 当我单击提交函数时,如何创建一个 Javascript 函数以将选定的复选框保存到数据库中?
在 laravel 控制器中,我知道如何保存它。
我只想知道如何将数据从视图传递到javascript?
``
<div class="table-responsive">
<button style="margin-bottom: 10px" class="btn btn-primary submitDatabase" data-url="">Submit to database</button>
<table class="table table-hover">
<thead>
<tr>
<th width="50px"><input type="checkbox" id="checkBox"></th>
<th>ID</th>
<th>Approved Date</th>
<th>Name</th>
<th>NRIC</th>
<th>Hospital</th>
<th>Condition</th>
<th>Cancer Type</th>
<th>Action</th>
</tr>
</thead>
<tbody>
@foreach($datas as $item)
<tr>
<td><input type="checkbox" class="singleSelectBox" data-id="{{$item->id}}"></td>
<td>{{$item->id}}</td>
<td>{{date('d-m-Y',strtotime($item->dtDecidedOn))}}</td>
<td>{{$item->varNm}}</td>
<td>{{$item->varIdNumber}}</td>
<td>{{$item->varHospitalNm}}</td>
<td>{{$item->varPrognosesNm}}</td>
<td>{{$item->varCancerNm}}</td>
<td><button class="btn btn-primary btn-sm reprint" id="{{$item->id}}" value="#">View</button></td>
</tr>
</tbody>
@endforeach
</table>
</div>
我希望如果全选,所有被选中的数据都将保存在数据库中。
如果选择单行数据,数据将保存在数据库中。
解决方案
在网页文件中
Route::post('checkedids','TestController@getCheckedIds')->name('postCheckedids');
然后
<td><input data-route="{{route('postCheckedids')}}" type="checkbox" class="singleSelectBox" name"singleBox" data-id="{{$item->id}}"></td>
脚本代码
$('.singleSelectBox').change(function (e) {
var route = $(this).attr('data-route');
var checked = [];
$.each($("input[name='singleBox[]']:checked"), function(){
checked.push($(this).val());
});
if (checked.length==0){
return;
}
$.ajax({
type:'post',
url :route,
dateType:'json',
data:{checked:checked},
success: function (data){
if (data.status==true){
console.log(data)
}else{
}
},error:function(){
alert('error,try again');
}
});
});
然后在我们控制器中的方法中
public function getCheckedIds(Request $request){
$ids = $request->ids;
}
推荐阅读
- java - io.qameta.allure.testng.AllureTestNg 无法实例化
- c# - c# winforms 数组项被删除
- javascript - 如何将 RTF 作为 HTML 嵌入到 React.JS 应用程序中
- javascript - Nodemailer - SMTP 超时 - office365
- typescript - 如何将 TypeScript 泛型与绑定一起使用?
- docker - 使用 docker 在容器中运行 Ngrok
- javascript - 如何在角度模块 app.module.ts 中加载 highcharts 注释模块?
- angular - 表单错误不可见
- php - Sql 正确过滤字符串列中的浮点值
- java - StackOverflowError:ProgressBar 的 Android 8.1 上的堆栈大小为 8MB