Laravel 的分页渲染未在 ajax 请求上传递变量（无限滚动）

Question

我正在尝试无限滚动 (based on this tutorial) 网站上的一些 user-uploaded 图片。当我使用我网站上的所有图像时，无限滚动效果很好，但是当我优化查询时，事情开始出现问题。

出于测试目的，我有 12 张图片。它们都有一个 "categorie" 字段、标题等

这些图像的标题为：vector1、vector2、vector3、drawing1、drawing2、drawing3、drawing4、interface1、interface2、interface3、interface4、interface5，它们都有相应的类别。

所以当我这样做时：

控制器

$query = $request->input('query');
$images = Status::where('is_image', 1)
->where('categorie', $query)
->where($orderByString, '>' , 0)
->whereIn('is_mature', [0, $mature])
->where('created_at', '>=', Carbon::now()->subHours($withinHours))
->orderBy($orderByString, 'desc')
->Paginate(2);

if($request->ajax()) {
    return [
        'images' => view('browse.partials.fullview_partial')->with(compact('images'))->render(),
        'next_page' => $images->nextPageUrl()
    ];
}       
return view('browse.fullview_results', ['categorie' => $categorie, 'orderBy' => $orderBy, 'orderText' => $orderText, 'orderURL' => $orderURL, 'queryString' => $queryString, 'withinText' => $withinText, 'withinURL' => $withinURL  ])->with('images', $images);

Blade

@if ($images->count())
<div class="endless-pagination" data-next-page={{ $images->nextPageUrl() }}>
    @foreach ($images as $status)
        <h4>{{ $status->title }}</h4>   
    @endforeach
    {{--{!! $images->render() !!}--}}
</div>
@endif

我得到 2 张图像。在本例中，drawing4 和 drawing3（因为我的查询是 "drawing"）按照我想要的方式排序。太棒了！

所以现在我想向下滚动页面以触发我的 ajax 调用以获取更多图像。

$(window).scroll(fetchImages);

function fetchImages() {

    var page = $('.endless-pagination').data('next-page');

    if(page !== null) {

        clearTimeout( $.data( this, "scrollCheck" ) );

        $.data( this, "scrollCheck", setTimeout(function() {
            var scroll_position_for_images_load = $(window).height() + $(window).scrollTop() + 900;

            if(scroll_position_for_images_load >= $(document).height()) {
                $.get(page, function(data){
                    $('.endless-pagination').append(data.images);
                    $('.endless-pagination').data('next-page', data.next_page);
                });     
            }
        }, 350))

    }
}

这得到部分 fullview_partial.blade.php:

@foreach ($images as $status)
    <h4>{{ $status->title }}</h4>   
@endforeach

还有...哎呀。什么都没有出现。这很奇怪。我只有drawing4和drawing3.

我回到我的控制器并切换

->where('categorie', $query)

到

->where('categorie', "drawing")

再次测试。这次，我得到了 drawing4 和 drawing3。我向下滚动并获得绘图 2 和绘图 1。

根据我得出的结论（我可能错了），似乎在 ajax 调用中，它没有使用相同的查询，而是再次通过我的控制器，但这次没有查询（因为查询来自 url）。这给我带来了重大问题，因为我有很多条件取决于查询是什么。

我该如何解决这个问题？

编辑

经进一步调查，似乎在 ajax 附加上，它确实再次通过我的控制器，但这次没有查询。我想我所需要的只是一种将那个变量再次传递到控制器中以使其工作的方法，但我不知道如何实现。

编辑 2

所以基本上我需要的只是转动这个：

 data-next-page={{ $images->nextPageUrl() }}

进入

 data-next-page={{ $images->nextPageUrl() + query }}

不知何故。至少这会解决第一次通话的问题。然后我需要将查询添加到

$('.endless-pagination').data('next-page', data.next_page);

Answer 1

想通了。

将 $query 与其他所有内容一起传递到视图中。

return view('browse.fullview_results', ['categorie' => $categorie, 'orderBy' => $orderBy, 'orderText' => $orderText, 'orderURL' => $orderURL, 'queryString' => $queryString, 'withinText' => $withinText, 'withinURL' => $withinURL  ])->with('images', $images)->with('query', $query);

并将其添加到 data-next-page:

data-next-page={{ $images->nextPageUrl() }}&query={{$query}}

所以下一个 GET 请求的 URL 看起来像：

fullview?page=2&query=drawing

Laravel 的分页渲染未在 ajax 请求上传递变量（无限滚动）

Laravel's pagination rendering not passing variables on ajax request (infinite scrolling)

php

ajax

pagination

laravel

laravel-5.1