Флажок Livewire выбор элементов на предыдущей странице для страницы с разделением на страницы

#php #laravel #laravel-livewire

Вопрос:

Пожалуйста, помогите, в настоящее время я работаю над этим проектом livewire. Страница разбита на страницы с помощью флажков. Когда я устанавливаю флажки на следующей странице, он перезагружает данные на первой странице и выбирает другой элемент с тем же номером в строке. Поэтому, если попытаться установить флажок в строке 3 на второй странице, данные обновятся, чтобы отобразить элементы предыдущей страницы, и установите флажок в строке 3. Я не могу понять, кто-нибудь, пожалуйста, помогите.

Ниже приведен мой код

     {
        $tracking_dates = Tracking::select(DB::raw('max(created_at) as created_at'))
            ->groupBy('tracking_number')
            ->get();
        $this->trackings = Tracking::query()
            ->when(Auth::user()->hasRole('user'), function($query){
                $query->whereHas('PurchaseRequest', function($sub_query) {
                    $sub_query->where('user_id', '=', Auth::id());
                });
            })
            ->whereIn('created_at', $tracking_dates)
            ->paginate(20);

        return view('livewire.index-tracker', [
                'trackings' => $this->trackings,
                'trackingStatus' => TrackingStatus::all(),
            ]);
    }
 

Мой код просмотра

                 <form>
                <table id="datatable-buttons" class="table table-striped table-bordered dt-responsive nowrap" cellspacing="0" width="100%">
                    <thead>
                    <tr>
                        @role('superadministrator')
                        <th>Multiple Action Select</th>
                        @endrole
                        <th>Item(s) Type</th>
                        <th>Tracking Number</th>
                        <th>Tracking Status</th>
                        <th>Invoice</th>
                        <th>Action</th>
                    </tr>
                    </thead>


                    <tbody>
                        @if(count($trackings) > 0)
                            @foreach($trackings as $key=>$tracking)
                                <tr>
                                    @role('superadministrator')
                                    <td>
                                        {{$tracking->id}}
                                        <input type="checkbox" value="{{$tracking->id}}" wire:model="selected">
                                    </td>
                                    @endrole
                                    <td>
                                        {{$tracking->purchase_request_id != "" ? "Purchase Request" : NULL}}
                                        {{$tracking->shipment_id != "" ? "Shipment" : NULL}}
                                    </td>
                                    <td>{{$tracking->tracking_number}}</td>
                                    <td>{{$tracking->TrackingStatus->name}}</td>
                                    <td>
                                        <a href="{{route('purchase_request.show',$tracking->PurchaseRequest->invoice_no)}}"><i class="mdi mdi-eye font-18"></i></a>
                                    </td>
                                    <td>
                                        <a href="{{route('tracking.show', $tracking->tracking_number)}}" class="m-r-15 text-muted" data-toggle="tooltip" data-placement="top" title="View Tracking Detail" data-original-title="View Tracking Invoice"><i class="mdi mdi-eye font-18"></i></a>
{{--                                        @role('superadministrator')--}}
                                        <a href="{{route('tracking.edit', $tracking->tracking_number)}}" class="m-r-15 text-muted" data-toggle="tooltip" data-placement="top" title="Edit" data-original-title="Edit"><i class="mdi mdi-pencil font-18"></i></a>
{{--                                        @endrole--}}
                                    </td>

                                </tr>
                            @endforeach
                        @else
                        <tr>
                            <td colspan="5">No data available</td>
                        </tr>
                    @endif
                    </tbody>
                </table>
                @role('superadministrator')
                    <div class="form-group row">
                        <button wire:click.prevent="store()" class="btn btn-primary btn-md">Track</button>
                    </div>
                </form>

                @if(count($trackings) > 0)
                    {{ $trackings->links() }}
                @endif``` 

 

Ответ №1:

Вы можете вызвать событие javascript page.dt() и сохранить все идентификаторы, которые вы зарегистрировали, в локальном хранилище. Пожалуйста, обратитесь к приведенному ниже коду для этого.

 var checkedData = [];
$('#tableID').on( 'page.dt', function () {
    let allIds = localStorage.getItem("row-data-ids").split(",");

    $('.checkboxes:checkbox:checked').each(function(index, rowId){
        if($.inArray( $(this).val(),  allIds) ==  -1){
            checkedData.push($(this).val());
        }

    });
    localStorage.setItem('row-data-ids', checkedData);
} );
 

Вы также можете сохранить значения локального хранилища в скрытой переменной, чтобы попасть в POST-запрос.

Комментарии:

1. Спасибо, но сначала я использую livewire, который выполняет привязку за меня, также ваше решение предполагает, что я использую таблицу данных, которой я являюсь до сих пор, но я удалил таблицу данных, и обновляется содержимое страницы.