复选框选择所有复选框 Laravel

Question

这是我的问题：

在 PHP Laravel 中，我有一个 foreach 循环，它在屏幕上显示消息，包括一个复选框。每条消息都有自己的复选框。我在所有消息的顶部还有一个复选框。我想为该复选框分配一个功能以检查所有复选框。我知道过去曾有人问过这个问题，但不幸的是，这些答案对我不起作用。有人对我有解决方案吗？

我正在使用：Laravel、Inspinia、Bootstrap 4

提前致谢！

这是我的代码：

@if(count($messages) > 0)

        <table class="table table-hover">

            <thead>

                <tr>

                    <th>&nbsp;</th>

                    //select all checkboxes

                    <th><input type="checkbox" class=""/></th>

                    <th>@sortablelink('title', trans('messages.title'))</th>

                    <th>@sortablelink('sender_user_id', trans('messages.sender'))</th>

                    <th class="d-none d-sm-table-cell">@sortablelink('created_at', trans('messages.sent_at'))</th>

                </tr>

            </thead>

            <tbody>

            @foreach ($messages as $message)

                <tr id="messagesTable">

                    <td><i class="{{ $message->read ? 'far fa-envelope-open' : 'fas fa-envelope' }}"></i></td>

                    //the checkboxes who need to be selected

                    <td class="project-title">

                        <div class="checkbox p1-1"> 

                            <input type="checkbox" id="message_{{$message->id}}" name="message" value="{{$message->id}}">

                            <label for="message_{{$message->id}}"></label>

                        </div>

                    </td>

        </table>

@endif

Answer 1

你可以做到jquery第一步改变这个//select all checkboxes<th><input type="checkbox" class=""/></th>对此//select all checkboxes<th><input type="checkbox" class="check_all"/></th> //just added a class to this element第二步将 class_name 添加到所有<input type="checkbox"> 我的意思<input type="checkbox" id="message_{{$message->id}}" name="message" value="{{$message->id}}">更改为<input type="checkbox" id="message_{{$message->id}}" name="message" value="{{$message->id}}" class="custom_name">笔记： be sure that all your checkboxes has one class_name instead the one witch if we click it others checked!第三步在页脚中添加这个<script&nbsp; src="https://code.jquery.com/jquery-3.4.1.js"&nbsp; integrity="sha256-WpOohJOqMqqyKL9FccASB9O0KwACQJpFTUBLTYOVvVU="&nbsp; crossorigin="anonymous"></script><script>&nbsp; &nbsp; $(".check_all").on("click", function(){&nbsp; &nbsp; &nbsp; &nbsp; $(".custom_name").each(function(){&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; $(this).attr("checked", true);&nbsp; &nbsp; &nbsp; &nbsp; });&nbsp; &nbsp; });</script>我 HPOE 这对你有用……