load more data on button click in laravel using ajax code example
Example: laravel load more button ajax
With @Shan help, i found the problem.
First i fixed my js in the footer on this one:
<script type="text/javascript">
var pageNumber = 2;
$(document).ready(function() {
$.ajax({
type : 'GET',
url: "websiteURL/posts?page=" +pageNumber,
success : function(data){
pageNumber +=1;
if(data.length == 0){
}else{
$('#grid').append(data.html);
}
},error: function(data){
},
})
});
$(window).scroll(function() {
if($(window).scrollTop() + $(window).height() >= $(document).height()) {
$.ajax({
type : 'GET',
url: "websiteURL/posts?page=" +pageNumber,
success : function(data){
pageNumber +=1;
if(data.length == 0){
}else{
$('#grid').append(data.html);
}
},error: function(data){
},
})
}
});
function loadMoreData(){
$.ajax({
type : 'GET',
url: "http://communitune.com/posts?page=" +pageNumber,
success : function(data){
pageNumber +=1;
if(data.length == 0){
}else{
$('#grid').append(data.html);
}
},error: function(data){
},
})
}
</script>
And then i put fixed controller also into
public function index(Request $request)
{
$posts = Post::orderBy('created_at', 'desc')->paginate(8);
$categories = Category::all();
if ($request->ajax()) {
$view = view('posts.load', compact('posts', 'categories'))->render();
return response()->json(['html'=>$view]);
}
return view('posts.display', compact('categories', 'posts'));
}
The credits goes to @Shan, in the comment who helped me to solve this.