Pagination with ajax not working

I´m using Laravel5.3.

The problem is that the current Pagenum is not set. I mean I get the correct data in the ajax call but in the subtemplate of the paginator there is a piece of code deciding wheter to disable current link or not.

@if ($paginator->onFirstPage())
    <li class="disable"><span>«</span></li>
 @else
     <li><a href="{{ $paginator->previousPageUrl() }}" rel="prev">«</a></li>
@endif

and the if is true eveytime.

So how can I set the pagenum that onFirstPage() is false ?

My complete pagination-logic is done in index()

public function index(Request $request)
    {
        $logicals = [];
        if ($request->ajax()) {
            $nextPageNum = $request['nextPageNum'];
            $order = $request['order'];
            $logicals = Logical::orderBy('logical', $order)->paginate(15, ['*'], 'page', $nextPageNum);
            return response()->json(['logicals' => $logicals]);
        } else {
            $logicals = Logical::orderBy('logical', 'asc')->paginate(15);
            return view('logicals.index', ['logicals' => $logicals]);
        }
    }

and the ajax part

$.ajax({
            url: paginationLink,
            method: 'POST',
            data: {
                nextPageNum: nextPageNum,
                order: $('thead').find('i').attr('data-order'),
                _token: $('table').find('input[name="_token"]').val(),
            },
            success: function (response) {
                // korrekten Paginierungslink aktivieren
                $('.pagination').find('li.active').removeClass('active');
                var elementToActivate = ($('.pagination').find('li').children().filter(function () {
                    return $(this).text() == nextPageNum;
                }));
                elementToActivate.parent('li').addClass('active');


                // neue Paginierungsinhalte einfügen
                var logicalsTable = $('table.logicals').find('tbody');
                logicalsTable.empty();
                $.each(response.logicals.data, function() {
                    logicalsTable.append('<tr><td id="' + $(this)[0].id + '"><a href="' + playUrl + $(this)[0].id + '">' + $(this)[0].logical + '</a></td></tr>')
                });
            }
        });

[email protected]

9 years ago

Best Answer

Level 1

It works!!! :-)

I only changed my LogicalsController@index and the ajax-code a bit, and thats all.

LogicalsController@index

public function index(Request $request)
    {
        if ($request->ajax()) {
            $nextPageNum = $request['nextPageNum'];
            $order = $request['order'];
            $logicals = Logical::orderBy('logical', $order)->paginate(15, ['*'], 'page', $nextPageNum);
            return response()->json(View::make('logicals.partials.tableForStartpage', ['logicals' => $logicals])->render());
        } else {
            $logicals = Logical::orderBy('logical', 'asc')->paginate(15);
            return view('logicals.index', ['logicals' => $logicals]);
        }
    }

logicals\index.blade.php

@extends('layouts.layout')

@section('content')
    <script>
        var orderLogicals = '{{ route('orderAjax') }}';
        var paginationLink = '{{ route('index') . '/' }}';
        var playUrl = '{{ route('play', [0]) }}';
    </script>

    <body>
        <aside class="container col-md-2">
            ...
        </aside>
        <section id="tableForStartpage" class="main col-md-10">
            @include('logicals.partials.tableForStartpage')
        </section>
    </body>
@endsection

logicals\partials\tableForStartpage

<table id="logicalsTable" class="logicals table table-striped" data-pagenum="{{ $logicals->currentPage() }}">
    {{ csrf_field() }}
    <thead><tr><th data-label="logical">
            Logical<i class="fa fa-sort-alpha-asc order" data-order="asc" aria-hidden="true"></i>
        </th></tr></thead>
    <tbody>
    @foreach($logicals as $logical)
        <tr>
            <td><a href="{{ URL('play', [$logical->id]) }}">{{ $logical->logical }}</a></td>
        </tr>
    @endforeach
    </tbody>
</table>
<div class="pagination">
    {{--uses the template in views\vendor\pagination\default.blade.php--}}
    {{--published with: php artisan vendor:publish--}}
    {{ $logicals->links() }}
</div>

and finally the ajax

$.ajax({
            url: paginationLink,
            method: 'POST',
            data: {
                nextPageNum: nextPageNum,
                order: order,
                _token: $('table').find('input[name="_token"]').val(),
            },
            success: function (response) {
                $('#tableForStartpage').html(response);
                $('#logicalsTable').find('thead').find('i')
                    .attr('data-order', order)
                    .removeClass(oldOrder)
                    .addClass(order);
            }
        });

Please or to participate in this conversation.