select2 might be a good solution for you: https://select2.org/
How to make filtering on client in blade listing written with jquery?
Hello,
In my Laravel 5.7/jquey 3/ bootstrap 4 / mysql app I make in user's editor listing of clients and buttons to give/revoke access to any user.
I fill div in user's editor :
<div class="tab-pane active" id="pills-related-user-access-clients" role="tabpanel"
aria-labelledby="pills-related-user-access-clients" style="border:3px dotted blue;">
<div id="div_related_user_access_clients" style="border:2px dotted green;"></div>
</div>
When javascript is run :
backendUser.prototype.getUserRelatedUserAccessClients = function (user_id) {
if ( typeof user_id == "undefined" ) return
var href = '/admin/get-user-related-user-access-clients/' + user_id;
$.ajax({
type: "GET",
dataType: "json",
url: href,
success: function (response) {
$("#div_related_user_access_clients").html(response.html);
},
error: function (error) {
popupErrorMessage(error.responseJSON.message)
}
});
} // function uploadUserDetailsInfo(user_id) {
and I use blade template for listing:
@if(count($clientsList) == 0)
<h4 class="card-subtitle pl-2 pb-2">Has no clients in the system yet</h4>
@else
<h4 class="card-subtitle pl-2 pb-2">Has {{ count($clientsList) }} clients, {{ $selected_user_access_clients_count }} selected for this user. </h4>
<div class="table-responsive" style="max-height: 900px; overflow-y:auto; width: 100% !important;">
<table class="table table-bordered table-striped text-primary ">
@foreach($clientsList as $next_key => $nextRelatedClient)
<tr>
<td>
{{$nextRelatedClient->client_id }}::{{ $nextRelatedClient->full_name }}
</td>
<td>
@if( !empty($nextRelatedClient->is_checked) )
<a href="#" onclick="javascript:backendUser.clearUserAccessClientToUser({{$nextRelatedClient->client_id }},'{{$nextRelatedClient->full_name }}')">
<i class="fa fa-remove"></i>Revoke Access
</a>
<b> Selected</b>
@else
<a href="#" onclick="javascript:backendUser.attachUserAccessClientToUser({{$nextRelatedClient->client_id }},
'{{$nextRelatedClient->full_name }}')">
<i class="fa fa-paperclip"></i>Give Access
</a>
@endif
</td>
</tr>
@endforeach
</table>
</div>
@endif
Also I am going to add checkbox near with any client to make group operations. It works for me, but clients listing is rather big(more 1000 items). Are there some tools to make search filter on client's side(no on server) ? At least 1 input for client name but with possibility to add filter inputs/checkbox, selection ? Also if some filter is applied not to lose group selections I have at this moment.
Thanks!
Please or to participate in this conversation.