Javascript 如何在Laravel中对通过AJAX呈现的数据表进行分页?

Javascript 如何在Laravel中对通过AJAX呈现的数据表进行分页?,javascript,php,ajax,laravel,Javascript,Php,Ajax,Laravel,我试图在Laravel中呈现一个刀片模板,该模板包含一个HTML表,其中包含通过AJAX获得的数据,并且需要使用Laravel的Lengshawarepaginator手动分页结果 我有一个名为reports.blade.php的主刀片文件,其中包含对名为的控制器方法的AJAX调用SalesController@get_sales_forecast。在该控制器中,我从MSSQL数据库获取一些数据,并呈现一个名为sales forecast table的局部视图,该视图将数据放入HTML表中。这一

我试图在Laravel中呈现一个刀片模板,该模板包含一个HTML表,其中包含通过AJAX获得的数据,并且需要使用Laravel的Lengshawarepaginator手动分页结果

我有一个名为reports.blade.php的主刀片文件,其中包含对名为的控制器方法的AJAX调用SalesController@get_sales_forecast。在该控制器中,我从MSSQL数据库获取一些数据,并呈现一个名为sales forecast table的局部视图,该视图将数据放入HTML表中。这一切都是成功的

然而,我现在正试图对这些结果进行分页,因为数据集非常大

在我的主刀片文件(reports.blade.php)中,AJAX调用如下所示:

$.ajax({
   type: 'POST',
   url:'{{action('SalesController@get_sales_forecast')}}',
   data: {
         _token: $('meta[name="_token"]').attr('content'),
         start_date: $('#txtStartDate').val(),
         end_date: $('#txtEndDate').val()
  },
  success:function(data) {
         $('#table-sales-forecast').html(data.html);
  }
});
public function get_sales_forecast(Request $request) {

        //Get data from Sales model
        $sales_forecast = Sales::getSalesForecast($start_date, $end_date);

        //Get current page
        $current_page = LengthAwarePaginator::resolveCurrentPage();

        //Create new collection
        $item_collection = collect($sales_forecast);

        //Define how many items to show per page
        $page_limit = 25;

        //Slice the collection to get the items to display in current page
        $current_page_items = $item_collection->slice(($current_page * $page_limit) - $page_limit, $page_limit)->all();

        //Create paginator 
        $paginated_items = new LengthAwarePaginator($current_page_items, count($item_collection), $page_limit);

        //Set URL path for generated links
        $paginated_items->withPath($request->url());

        //Render the view as an HTML string
        $html = view('sales-forecast-table')->with(['sales_forecast' => $paginated_items])->render();

        //Return the HTML 
        return response()->json(compact('html'));
    }
@if(isset($sales_forecast))
    {!!$sales_forecast->links()!!}
    <table class='table table-hover table-striped table-bordered'>
        @foreach($sales_forecast as $record)
            <tr>
                <td>{{$record->id}}</td>
                <td>{{$record->location}}</td>
                <td>{!!$record->customer!!}</td>
                <td>{!!$record->forecast!!}</td>
        @endforeach
    </table>
@endif
此外,reports.blade.php还包括一个局部视图:

<div class="table-responsive" id="table-part-forecast-annual">
    @include('sales-forecast-table')
</div>
从AJAX调用(sales forecast table.blade.php)呈现的视图如下所示:

$.ajax({
   type: 'POST',
   url:'{{action('SalesController@get_sales_forecast')}}',
   data: {
         _token: $('meta[name="_token"]').attr('content'),
         start_date: $('#txtStartDate').val(),
         end_date: $('#txtEndDate').val()
  },
  success:function(data) {
         $('#table-sales-forecast').html(data.html);
  }
});
public function get_sales_forecast(Request $request) {

        //Get data from Sales model
        $sales_forecast = Sales::getSalesForecast($start_date, $end_date);

        //Get current page
        $current_page = LengthAwarePaginator::resolveCurrentPage();

        //Create new collection
        $item_collection = collect($sales_forecast);

        //Define how many items to show per page
        $page_limit = 25;

        //Slice the collection to get the items to display in current page
        $current_page_items = $item_collection->slice(($current_page * $page_limit) - $page_limit, $page_limit)->all();

        //Create paginator 
        $paginated_items = new LengthAwarePaginator($current_page_items, count($item_collection), $page_limit);

        //Set URL path for generated links
        $paginated_items->withPath($request->url());

        //Render the view as an HTML string
        $html = view('sales-forecast-table')->with(['sales_forecast' => $paginated_items])->render();

        //Return the HTML 
        return response()->json(compact('html'));
    }
@if(isset($sales_forecast))
    {!!$sales_forecast->links()!!}
    <table class='table table-hover table-striped table-bordered'>
        @foreach($sales_forecast as $record)
            <tr>
                <td>{{$record->id}}</td>
                <td>{{$record->location}}</td>
                <td>{!!$record->customer!!}</td>
                <td>{!!$record->forecast!!}</td>
        @endforeach
    </table>
@endif
@if(isset($sales\u forecast))
{!!$sales\u forecast->links()!!}
@foreach($sales\u forecast为$record)
{{$record->id}
{{$record->location}
{!!$record->customer!!}
{!!$record->forecast!!}
@endforeach
@恩迪夫

此时,表确实呈现,页面链接甚至出现。该表仅按预期显示前25行(按照
$page\u limit=25
行),并选择了第1页,但当我单击任何其他页面链接时,我只会收到一个“无消息”错误。错误信息太模糊了,我不太确定从这里该怎么办。也许我在Laravel中以一种过于复杂的方式使用AJAX?我试图尽可能地遵守框架的约定,但如果这能使问题更容易解决,我愿意尝试不同的方法。

我假设
getSalesForcast
是一个范围,因此它应该返回一个集合。我建议使用
forPage
。我不能100%确定您是如何在请求中获得开始日期和结束参数的,但是如果给定这些值,这应该可以工作。另外,我假设您使用的是时间戳

const $page_limit = 25;

public function get_sales_forecast(Request $request) {

    //Get current page
    $current_page = LengthAwarePaginator::resolveCurrentPage();

    //Get data from Sales model
    $sales_forecast = Sales::where('created_at','>',$request->input('start_date'))
                      ->where('created_at','<',$request->input('end_date'))
                      ->forPage($current_page,self::$page_limit)
                      ->get();

    //Create paginator 
    $LengthAwarePaginator = new LengthAwarePaginator($sales_forecast, $sales_forecast->count(), self::$page_limit);

    //Set URL path for generated links
    $paginated_items->withPath($LengthAwarePaginator->url($current_page));

    //Render the view as an HTML string
    $html = view('sales-forecast-table')->with(['sales_forecast' => $LengthAwarePaginator->items()])->render();

    //Return the HTML 
    return response()->json(compact('html'));
}
const$page\u limit=25;
公共功能获取销售预测(请求$Request){
//获取当前页面
$current_page=lengshawarepaginator::resolveCurrentPage();
//从销售模型中获取数据
$sales\u forecast=sales::where('created\u at','>',$request->input('start\u date'))

->where('created_at',”我假设
getSalesForcast
是一个作用域,因此它应该返回一个集合。我建议使用
forPage
。我不能100%确定您是如何在请求中获取开始日期和结束参数的,但如果给定这些值,这应该可以工作。此外,我还假设您使用的是时间戳

const $page_limit = 25;

public function get_sales_forecast(Request $request) {

    //Get current page
    $current_page = LengthAwarePaginator::resolveCurrentPage();

    //Get data from Sales model
    $sales_forecast = Sales::where('created_at','>',$request->input('start_date'))
                      ->where('created_at','<',$request->input('end_date'))
                      ->forPage($current_page,self::$page_limit)
                      ->get();

    //Create paginator 
    $LengthAwarePaginator = new LengthAwarePaginator($sales_forecast, $sales_forecast->count(), self::$page_limit);

    //Set URL path for generated links
    $paginated_items->withPath($LengthAwarePaginator->url($current_page));

    //Render the view as an HTML string
    $html = view('sales-forecast-table')->with(['sales_forecast' => $LengthAwarePaginator->items()])->render();

    //Return the HTML 
    return response()->json(compact('html'));
}
const$page\u limit=25;
公共功能获取销售预测(请求$Request){
//获取当前页面
$current_page=lengshawarepaginator::resolveCurrentPage();
//从销售模型中获取数据
$sales\u forecast=sales::where('created\u at','>',$request->input('start\u date'))

->在哪里('created_at','您的
$paginated_items
中呈现的链接是否设置为在单击时通过ajax加载?单击时这些链接应该放在哪里?我想这就是我一直停留的地方。通常,在我不使用ajax获取数据的页面上,单击由Laravel内置分页呈现的页面链接只需重新加载即可当前页面,但显示下一组数据,并向URL添加页码。例如,如果该页面的地址是www.example.com,用户单击“2”,则该页面将重新加载为www.example.com?page=2。如果该页面的限制设置为25,则将显示下25行数据。我不确定如何设置页面链接他们会回忆起的地方SalesController@get_sales_forecast.我相信这很简单,但因为有太多的层次,我很难思考如何做。@thisiskelvin忘了@you,这是我第一次在这里发布问题,所以我有点不知所措。:)为什么要对内容进行两次分页?您在集合中进行了一次分页,在laravel类中又进行了一次分页。您的
$paginated_items
中呈现的链接是否设置为在单击时通过ajax加载?单击时这些链接应该放在哪里?我想这就是我所处的位置。通常,在我不使用ajax获取数据的页面上,单击由Laravel内置分页呈现的页面链接,只需重新加载当前页面,但会显示下一组数据,并向URL添加页码。例如,如果页面地址为www.example.com,用户单击“2”,则页面将重新加载为www.example.com?page=2。如果页面的限制设置为25,它将显示接下来的25行数据。我不确定如何将页面链接设置到它们将调用的位置SalesController@get_sales_forecast.我相信这很简单,但因为有太多的层次,我很难思考如何做。@thisiskelvin忘了@you,这是我第一次发布问题n在这里,所以我有点不知所措。:)你为什么要把东西分页两次?你在你的收藏上做了一次,在laravel类上又做了一次。