AJAX与Laravel的分页

我有这个名为posts.blade.php视图，它包含在home.blade.php ：

 
 @foreach ($posts as $post) 
 
 thumbnail) }}" alt="" /> 
{{{ $post->title }}}
 
 
{{ $post->rating }}
 
 @endforeach 
{{{ $posts->links() }}}
  

当用户搜索某些post时，控制器的postSearch()函数返回一个JSON响应：

 function postSearch() { $posts = $posts->select(...)->where(...)->orderBy(...)->paginate(5); //Search posts return Response::json(View::make('includes.posts', ['posts' => $posts])->render()); } 

并且jQuery在#posts div上附加HTML：

 $('#search').submit(function(e) { e.preventDefault(); var form = $(this); $.post(form.attr('action'), form.serialize(), function(data) { $('#posts').html(data); }); }); 

这很完美。 但现在当我点击分页链接时，页面重新加载，我的搜索结果消失了（显而易见）。 我如何分页这些post？ 我已经读过这篇文章和本文，但我不明白如何实现它。

编辑

到目前为止，这是我的jQuery分页：

 $('#posts').on('click', '.pagination a', function(e) { e.preventDefault(); var url = $(this).attr('href'), page = url.split('page=')[1], data = $('#search').serializeArray(); data.push({page: page}); // Add page variable to post data console.log(data); $.post($('#search').attr('action'), data, function(data) { $('#posts').html(data['posts']); }); }); 

这是我点击分页链接时发送的数据（第2页）：

不幸的是，没有任何反应，第1页的post一直在显示。

Answer 1

我对Laravel的分页不是很熟悉，但从你列出的链接来看，它看起来并不太难。 此代码未经测试，但……

 $('#pagination a').on('click', function(e){ e.preventDefault(); var url = $(this).attr('href'); $.post(url, $('#search').serialize(), function(data){ $('#posts').html(data); }); }); 

更新

如果分页链接错误（就像OP的那些），你必须自己构建url。
只需要你想要的url，并添加?page=#number 。

 // page being the page number stripped from the original link var url = $('#search').attr('action')+'?page='+page; 

Answer 2

我有完美的工具。 请查看此repo https://github.com/themightysapien/ajaxtable

请阅读文档，它非常易于使用，专门用于laravel。 您需要做的就是返回结果，如下例所示。

 return Response::json(array( 'data'=> View::make('only_table_row_view', compact('collection')->render(), 'pagination'=>(string) $collection->links() )); 

添加所需文件

   $(".yourtable").ajaxtable(); 

通过表中的data-requestUrl属性初始化ajax url。 在页面中添加id =“paginationWrapper” div，以显示您的分页。

如果您有任何问题，请在本地服务器中运行repo，并查看html标记和插件选项的来源。

Answer 3

我正在使用以下js获取有关href click的数据。

 // Your Local url var Url = 'laraveltestproject/laravelpagination'; $('#ajaxContent').load("Url"); $('.pagination a').on('click', function(event) { event.preventDefault(); if ($(this).attr('href') != '#') { $('#ajaxContent').load($(this).attr('href')); } }); 

有关完整示例，请访问http://www.tutsway.com/laravel-ajax-pagination-example.php 。

Answer 4

在博客中发帖的示例，解决删除按钮上的分页重新加载：（sinple foreach但你必须给面板和按钮一个id，一个类按钮并使用$ post-> id来定义所有）

最后的诀窍不是调用使用pagination（）的视图/控制器，而是根据需要使用javascript更改视图。

  @foreach($posts as $post) 
 
 {!! $post->content !!} 
 
  creado {{$post->created_at->diffForHumans()}}  modificado {{$post->updated_at->diffForHumans()}} autor: {{ imagica\User::find($post->user_id)->name}} @if(Auth::user()->id === $post->user_id) 
 eliminar 
 
 Editar {{-- {{ csrf_field() }} --}} 
 @endif 
 
 @endforeach 

在最后的视图javascript：

 $(function(){ $(".destroy").on("click", function(){ var vid = $(this).attr("id"); var v_token = "{{csrf_token()}}"; var parametros = {_method: 'DELETE', _token: v_token}; var archivo = "http://imagica.app/posts/" + vid + ""; $.ajax({ type: "POST", url: archivo, data: parametros, success: function(data){ $('#panel'+ data).hide(); location.reload(); } }); }); }); 

在控制器销毁function中（注意你将$ post-> id作为数据发送到ajax，它用于定义选择器以隐藏你删除的post面板）：

  public function destroy($id) { $post= Post::find($id); $article_id= $post->article_id; $article= Article::find($article_id); $msg = session()->flash('message', "Post eliminado."); $post-> delete(); $data= $post->id; return $data; } 

在javascript最后一个函数“location.reload（）”是为了收取flash消息。