Ajax 分页搜索 [Laravel]
Ajax Search with pagination [Laravel]
这两本书我都读过 https://gist.github.com/tobysteward/6163902 & AJAX pagination with Laravel 但我似乎遇到了不同的问题所以无论如何。
长话短说:当我搜索时,获取了正确的数据并且 ajax 仅适用于第一页 "display data, no refresh",但从下一页开始刷新页面,那么如何制作ajax 调用该循环遍历返回的数据并根据每个页面显示它?
还有如何将搜索查询添加到 URL,目前当获取数据时,URL 不会更新,而是保持其当前状态(即 index?page=3
).
搜索表单
{{ Form::open(['route' => 'search', 'method' => 'GET', 'id' => 's-form',])}}
{{ Form::text('search', null, ['id' => 'search', 'placeholder' => 'Search For ...']) }}
{{ Form::submit(Go) }}
{{ Form::close() }}
搜索控制器
public function search() {
$input = Input::get('search');
$posts = Post::where('title','LIKE',$input)->paginate(4);
if (Request::ajax()) {
return View::make('posts.search')->withPosts($posts);
}
return View::make('posts.index')->withPosts($posts);
}
搜索视图
@forelse ($posts as $post)
// do stuff
@endforeach
<nav>{{ $posts->appends(Request::except('page'))->links() }}</nav>
js
$('#s-form').submit(function(e)
{
e.preventDefault();
$.ajax({
url: $(this).attr('action'),
data:{
search: $('#search').val()
},
success: function(data){
$('#result').html(data);
}
});
});
这就是它所需要的:
$(document).ajaxComplete(function() {
$('.pagination li a').click(function(e) {
e.preventDefault();
var url = $(this).attr('href');
$.ajax({
url: url,
success: function(data) {
$('#result').html(data);
}
});
});
});
现在我只需要根据每个页面更新URL。
这两本书我都读过 https://gist.github.com/tobysteward/6163902 & AJAX pagination with Laravel 但我似乎遇到了不同的问题所以无论如何。
长话短说:当我搜索时,获取了正确的数据并且 ajax 仅适用于第一页 "display data, no refresh",但从下一页开始刷新页面,那么如何制作ajax 调用该循环遍历返回的数据并根据每个页面显示它?
还有如何将搜索查询添加到 URL,目前当获取数据时,URL 不会更新,而是保持其当前状态(即 index?page=3
).
搜索表单
{{ Form::open(['route' => 'search', 'method' => 'GET', 'id' => 's-form',])}}
{{ Form::text('search', null, ['id' => 'search', 'placeholder' => 'Search For ...']) }}
{{ Form::submit(Go) }}
{{ Form::close() }}
搜索控制器
public function search() {
$input = Input::get('search');
$posts = Post::where('title','LIKE',$input)->paginate(4);
if (Request::ajax()) {
return View::make('posts.search')->withPosts($posts);
}
return View::make('posts.index')->withPosts($posts);
}
搜索视图
@forelse ($posts as $post)
// do stuff
@endforeach
<nav>{{ $posts->appends(Request::except('page'))->links() }}</nav>
js
$('#s-form').submit(function(e)
{
e.preventDefault();
$.ajax({
url: $(this).attr('action'),
data:{
search: $('#search').val()
},
success: function(data){
$('#result').html(data);
}
});
});
这就是它所需要的:
$(document).ajaxComplete(function() {
$('.pagination li a').click(function(e) {
e.preventDefault();
var url = $(this).attr('href');
$.ajax({
url: url,
success: function(data) {
$('#result').html(data);
}
});
});
});
现在我只需要根据每个页面更新URL。