Флажок установите все флажки Laravel

Question

Вот моя проблема:

В PHP Laravel У меня есть foreach l oop, который отображает сообщения на экране, включая флажок. Каждое сообщение имеет свой собственный флажок. У меня также есть флажок в верхней части всех сообщений. Я хотел бы назначить функцию для этого флажка, чтобы проверить все флажки. Я знаю, что этот вопрос задавался в прошлом, но, к сожалению, эти ответы не сработали для меня. У кого-нибудь есть решение для меня?

Я использую: 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>

                    <td class="project-title">
                        <a href="{{ route('messages.read', [$message->id]) }}">{{$message->title}}</a>
                    </td>
                    <td class="project-title">
                        <a href="{{ route('messages.read', [$message->id]) }}">{{ $message->sender ? $message->sender->name : ''}}</a>
                    </td>
                    <td class="project-title d-none d-sm-table-cell">
                        <a href="{{ route('messages.read', [$message->id]) }}">{{$message->created_at->format('d-m-Y H:i')}}</a>
                    </td>
                </tr>
            @endforeach
            </tbody>
        </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

---

Второй шаг добавьте имя_класса ко всем вашим <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
  src="https://code.jquery.com/jquery-3.4.1.js"
  integrity="sha256-WpOohJOqMqqyKL9FccASB9O0KwACQJpFTUBLTYOVvVU="
  crossorigin="anonymous"></script>
<script>
    $(".check_all").on("click", function(){
        $(".custom_name").each(function(){
            $(this).attr("checked", true);
        });
    });
</script>

Я думаю, что это работает для вас ...