Here is my problem:
In PHP Laravel I have a foreach loop that displays messages on the screen including a checkbox. Every message has its own checkbox. I also have a checkbox at the top of all the messages. I would like to assign a function to that checkbox to check all the checkboxes. I know this question has been asked in the past, but unfortunately those answers didn't work for me. Does someone have a solution for me?
I'm using: Laravel, Inspinia, Bootstrap 4
Thanks in advance!
Here is my code:
@if(count($messages) > 0)
<table class="table table-hover">
<thead>
<tr>
<th> </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
you can do it in jquery
first step
change this
//select all checkboxes
<th><input type="checkbox" class=""/></th>
to this
//select all checkboxes
<th><input type="checkbox" class="check_all"/></th> //just added a class to this element
Second step
add class_name to all your <input type="checkbox">
i mean <input type="checkbox" id="message_{{$message->id}}" name="message" value="{{$message->id}}">
changed to <input type="checkbox" id="message_{{$message->id}}" name="message" value="{{$message->id}}" class="custom_name">
NOTE: be sure that all your checkboxes has one class_name instead the one witch if we click it others checked!
Third step
add this in footer
<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>
I HPOE THIS WORKS FOR YOU...
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.