首页 > 解决方案 > 带有自定义过滤器的 Ajax 分页器

问题描述

我已成功采用本指南:https ://laraget.com/blog/how-to-create-an-ajax-pagination-using-laravel满足我的需要,它有效,但如果我应用我的分页将不起作用自定义过滤器。

让我们从 routes/web.php 开始:

// products routes
Route::get('products', 'ProductController@index')->name('CatalogIndex');
// sorting products with custom filters
Route::post('products', 'ProductController@Filters');

然后我们要去ProductController.php:

public function index(Request $request)
{
    $products = Product::orderBy('created_at', 'desc')->paginate(12);

    if ($request->ajax()) {
        $products_view = view('includes.products', compact('products'))->render();
        return response()->json(compact('products_view'));
    }

    return view('catalog.index', compact('products', 'power', 'area', 'source'));
}

    // filtering products
    public function Filters(Request $request, Product $product)
    {
        if ($request->ajax()) {
            // using query builder here
            $prods = $product->newQuery();
            // sorting by price
            if ($request->has('order')) {
                if ($request->input('order') == 'default') {
                    $prods->orderBy('created_at', 'desc');
                } else {
                    $prods->orderBy('price', $request->input('order'));
                }
            }

// more filters omitted for readability

            $products = $prods->paginate(12);

            $products_view = view('includes.products', compact('products'))->render();
            return response()->json(compact('products_view'));
        }

        return abort(403, 'Unauthorized action.');
    }

一些 javascript,使这些过滤器工作:

        $('body').on('click', '.pagination a', function(e) {
            e.preventDefault();

            var url = $(this).attr('href');
            getProducts(url);
            window.history.pushState("", "", url);
        });

        function getProducts(url) {
            $.ajax({
                method: 'get',
                url: url,
                success: function(data) {
                    $('#products').html(data.products_view);
                    console.log(data);
                },
                error: function(jqxhr, status, exception) {
                    console.log('Error' + exception);
                }
            });
        }

现在是问题,使用 ajax 的正常分页工作得很好,如果我不应用任何过滤器,但如果应用过滤器(选择电源等于某物的所有产品等),那么当我点击分页链接时,它只是导致我在第 2 页上的 ProductController 索引方法忽略了我的过滤器,还将 url 更改为“products?page=2”,我期望以下行为 -> 当您应用源过滤器 == somevalue,然后单击第 2 页时,它将显示应用源过滤器的所有产品的第二页,现在它仅显示索引方法,并按 created_at 列进行简单排序。

标签: ajaxlaravel

解决方案


你需要:

在刀片部分上附加分页器上的 adicional 参数,如下所示:

  {!!  $products->appends(['param1' => 'val1', 'param2'=>'val2'])->links() !!}

在你的方法 index() 上这样做:

 if ($request->ajax()) {
    return $this->filters($request, $product); 
}

祝你好运。


推荐阅读