Be part of JetBrains PHPverse 2026 on June 9 – a free online event bringing PHP devs worldwide together.

mstdmstd's avatar

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>&nbsp;&nbsp;Selected</b>&nbsp;
                        @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!

0 likes
4 replies
mstdmstd's avatar

Actually I mean something different : like table with data on client with custom Filter inputs and custom columns for rows of data. Are there something like that ?

Please or to participate in this conversation.