Laravel 7 - 更新没有表单或按钮的复选框的值

Laravel 7 - Update value of checkbox without form or button

我的项目卡住了,请帮忙...

是这样的情况:在我的项目中,我必须分配一个老师给学生打分的权限,因为一个组可以有2个或更多的老师,但只有一个必须有打分的权限,所以...我在数据库中的 table 'teachers' 中添加了一列,名称为 'grade',类型为布尔值。在我看来,我添加了一个复选框...如何更改复选框的值而不使用任何表单或按钮来触发操作并激活将有权评分的老师的复选框?并且这个值也应该在数据库中更新。


    <!--teachers-->
    <table class=" table table-sm table-striped table-bordered ">
        <thead class="text-white bg-primary">
            <tr>
                <th>@lang('show.Identifier')</th>
                <th>@lang('show.email')</th>
                <th>@lang('show.grade')</th>
                <th>@lang('show.delete')</th>
            </tr>
        </thead>
        
        <tbody class="small text-center">
            @foreach ($group->teachers as $teacher)
                <tr>
                    <td >{{$teacher->Identifier}} </td>
                    <td >{{$teacher->email}} </td>
                    <td>
                        <input id="active" {{$teacher->grade == 1 ?'checked':''}} type="checkbox" name="grade" value="1">
                    </td>
                    <td>
                        <form method="post" action="{{url('Groups/Disenroll/'.$group->idGroup.'?idTeacher='.$teacher->idTeacher)}}">
                        {{csrf_field()}}
                            <button type="submit"  class="btn btn-sm btn-outline-danger"  > <i class="material-icons small" >call_split</i></button>
                        </form>
                    </td>
                </tr>
            @endforeach
        </tbody>
    </table>

这是 table 的图片,如果有帮助...

我想你可以使用类似 JQuery 的东西。

您可以先将 toggle-class 的 class 添加到您的复选框

<input class="active toggle-class" {{$teacher->grade == 1 ?'checked':''}} type="checkbox" name="grade">

其次,确保您有办法跟踪谁在做成绩。

在您的复选框上添加 data-id="{{ $teacher->Identifier}}"

<input data-id="{{ $teacher->Identifier}}" class="active toggle-class" {{$teacher->grade == 1 ?'checked':''}} type="checkbox" name="grade">

在你的web.php中添加一条新路线

Route::get('/path/to/updateGrader/status', [App\Http\Controllers\MyController::class, 'updateGraderStatus']);

将以下代码添加到您的复选框所在的位置

$('.toggle-class').on('change',function(){
    let status = $(this).prop('checked') == true ? true : false;
    let grader_id = $(this).data('id');
    $.ajax({
       type:'GET',
       dataType:'json',
       url:'/path/to/updateGrader/status', // add your earlier created route here
       data:{'grade': status, 'grader_id': grader_id},
       success: function(data){
        console.log('success');
     }
   });
});

在您的控制器中,MyController 在我们的例子中创建一个新函数

public function updateGraderStatus(Request $request)
{
       $grader = MyModel::find($request->grader_id);
       $grader->grade = $request->grade;
       $grader->save(); 
}

如果对您有帮助,请告诉我。我没有对其进行测试,但我认为这就是您的处理方式。