本文介绍了Laravel:将更多数据从控制器加载到视图中的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！
问题描述
我想问一下如何使用js或ajax显示更多数据，然后调用Controller将结果显示到我的视图中.到目前为止，我第一次显示8条带有limit(8)的帖子.然后，我正在使用ajax来调用控制器，并每次带来8个以上的帖子.我面临的问题是，每次我调用控制器或Ajax时，帖子都是相同的.这是我的
i would like to ask how can i display more data by using js or ajax and call Controller displaying the result into my view. Until now i 'm displaying 8 posts with limit(8) for the first time. Then i 'm using ajax to call the controller and bring each time more 8 posts. The problem i 'm facing is that the posts are the same each time i call the controller or the ajax. This is my
class PostsController extends Controller {
public function index(Request $request)
{
$posts = Post::orderBy('created_at', 'desc')->limit(4)->get();
$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'));
}
}
Route::get('/posts', 'PostsController@index');
<div class="col-md-8 col-md-offset-2" id="grid" style="padding-top: 40px;">
@foreach($posts as $post)
@if(strlen($post->body) < "701")
<div class="item">
<div class="col-col-12 tr-share share" style="padding: 1px 0 1px 0">
<span class="time">{{$post->created_at}}</span>
<a href="">
<span class="emoji">
{{Emoji::findByName("link")}}
</span>
</a>
<a href="">
<span class="emoji">
{{Emoji::findByName("mail")}}
</span>
</a>
<a href="">
<span class="emoji">
{{Emoji::findByName("pin")}}
</span>
</a>
</div>
<div class="tr-text">
<div class="col-md-12 td-text">
<p><a>{{$post->body}}</a></p>
</div>
</div>
<div class="tr-tag">
<div style="padding: 1px 0 1px 0; text-align: center">
{{Emoji::findByName("tag")}}Tag:
@foreach($categories as $category)
@if($category->id == $post->category_un)
<a href=""><span class="tag-un">#{{$category->name}}</span></a>,
@endif
@if($category->id == $post->category_fac)
<a href=""><span class="tag-fac">#{{$category->name}}</span></a>
@endif
@endforeach
</div>
</div>
<div class="tr-options">
<a href="" style="color: #dca20f"><span class="cool">(0) {{Emoji::findByName("cool")}}</span></a>
<hr class="vt-hr" />
<a href="" style="color: #AA8062"><span class="poo">(0) {{Emoji::findByName("poo")}}</span></a>
<hr class="vt-hr" />
<a href="" style="color: #000000"><span class="speech">(0) {{Emoji::findByName("speech")}}</span></a>
</div>
</div>
@elseif(strlen($post->body) > "700")
<div class="item">
<div class="col-col-12 tr-share share" style="padding: 1px 0 1px 0">
<span class="time">{{$post->created_at}}</span>
<a href="">
<span class="emoji">
{{Emoji::findByName("link")}}
</span>
</a>
<a href="">
<span class="emoji">
{{Emoji::findByName("mail")}}
</span>
</a>
<a href="">
<span class="emoji">
{{Emoji::findByName("pin")}}
</span>
</a>
</div>
<div class="tr-text">
<div class="col-md-12 td-text">
<p class="more"><a>{{$post->body}}</a></p>
<?php // echo strlen($post->body);?>
<!--- <a><span>Διάβασέ την συνέχεια..</span></a> -->
</div>
</div>
<div class="tr-tag">
<div style="padding: 1px 0 1px 0; text-align: center">
{{Emoji::findByName("tag")}}Tag:
@foreach($categories as $category)
@if($category->id == $post->category_un)
<a href=""><span class="tag-un">#{{$category->name}}</span></a>,
@endif
@if($category->id == $post->category_fac)
<a href=""><span class="tag-fac">#{{$category->name}}</span></a>
@endif
@endforeach
</div>
</div>
<div class="tr-options">
<a href="" style="color: #dca20f"><span class="cool">(0) {{Emoji::findByName("cool")}}</span></a>
<hr class="vt-hr" />
<a href="" style="color: #AA8062"><span class="poo">(0) {{Emoji::findByName("poo")}}</span></a>
<hr class="vt-hr" />
<a href="" style="color: #000000"><span class="speech">(0) {{Emoji::findByName("speech")}}</span></a>
</div>
</div>
@endif
@endforeach
</div>
<div class="ajax-load text-center" style="display:none">
<p><img src=""></p>
</div>
<script type="text/javascript">
$(window).scroll(function() {
var flag = 0;
if($(window).scrollTop() + $(window).height() >= $(document).height()) {
$.ajax(
{
url: '/posts',
type: 'get',
/*beforeSend: function()
{
$('.ajax-load').show();
}*/
data: {
'offset': flag,
'limit': 8
},
success: function(data){
$('.ajax-load').hide();
$("#grid").append(data.html);
flag += 8;
}
})
}
});
function loadMoreData(){
$.ajax(
{
url: '/posts',
type: 'get',
/*beforeSend: function()
{
$('.ajax-load').show();
}*/
data: {
'offset': 0,
'limit': 8
}
})
.done(function(data)
{
if(data.html == " "){
$('.ajax-load').html("No more records found");
return;
}
$('.ajax-load').hide();
$("#grid").append(data.html);
flag += 8;
})
.fail(function(jqXHR, ajaxOptions, thrownError)
{
alert('server not responding...');
});
}
@foreach($posts as $post)
@if(strlen($post->body) < "701")
<div class="item">
<div class="col-col-12 tr-share share" style="padding: 1px 0 1px 0">
<span class="time">{{$post->created_at}}</span>
<a href="">
<span class="emoji">
{{Emoji::findByName("link")}}
</span>
</a>
<a href="">
<span class="emoji">
{{Emoji::findByName("mail")}}
</span>
</a>
<a href="">
<span class="emoji">
{{Emoji::findByName("pin")}}
</span>
</a>
</div>
<div class="tr-text">
<div class="col-md-12 td-text">
<p><a>{{$post->body}}</a></p>
</div>
</div>
<div class="tr-tag">
<div style="padding: 1px 0 1px 0; text-align: center">
{{Emoji::findByName("tag")}}Tag:
@foreach($categories as $category)
@if($category->id == $post->category_un)
<a href=""><span class="tag-un">#{{$category->name}}</span></a>,
@endif
@if($category->id == $post->category_fac)
<a href=""><span class="tag-fac">#{{$category->name}}</span></a>
@endif
@endforeach
</div>
</div>
<div class="tr-options">
<a href="" style="color: #dca20f"><span class="cool">(0) {{Emoji::findByName("cool")}}</span></a>
<hr class="vt-hr" />
<a href="" style="color: #AA8062"><span class="poo">(0) {{Emoji::findByName("poo")}}</span></a>
<hr class="vt-hr" />
<a href="" style="color: #000000"><span class="speech">(0) {{Emoji::findByName("speech")}}</span></a>
</div>
</div>
@elseif(strlen($post->body) > "700")
<div class="item">
<div class="col-col-12 tr-share share" style="padding: 1px 0 1px 0">
<span class="time">{{$post->created_at}}</span>
<a href="">
<span class="emoji">
{{Emoji::findByName("link")}}
</span>
</a>
<a href="">
<span class="emoji">
{{Emoji::findByName("mail")}}
</span>
</a>
<a href="">
<span class="emoji">
{{Emoji::findByName("pin")}}
</span>
</a>
</div>
<div class="tr-text">
<div class="col-md-12 td-text">
<p class="more"><a>{{$post->body}}</a></p>
<?php // echo strlen($post->body);?>
<!--- <a><span>Διάβασέ την συνέχεια..</span></a> -->
</div>
</div>
<div class="tr-tag">
<div style="padding: 1px 0 1px 0; text-align: center">
{{Emoji::findByName("tag")}}Tag:
@foreach($categories as $category)
@if($category->id == $post->category_un)
<a href=""><span class="tag-un">#{{$category->name}}</span></a>,
@endif
@if($category->id == $post->category_fac)
<a href=""><span class="tag-fac">#{{$category->name}}</span></a>
@endif
@endforeach
</div>
</div>
<div class="tr-options">
<a href="" style="color: #dca20f"><span class="cool">(0) {{Emoji::findByName("cool")}}</span></a>
<hr class="vt-hr" />
<a href="" style="color: #AA8062"><span class="poo">(0) {{Emoji::findByName("poo")}}</span></a>
<hr class="vt-hr" />
<a href="" style="color: #000000"><span class="speech">(0) {{Emoji::findByName("speech")}}</span></a>
</div>
</div>
@endif
@endforeach
所以我的问题是，为什么这总是带来相同的数据?每次我到达滚动的结尾并且ajax调用控制器时，它都会粘贴前8个帖子，而不是下一个8个帖子.我是否遗漏了某些东西或我的代码有误?任何帮助将不胜感激.
So my question is, why this brings always the same data? Every time i get at the end of the scroll and the ajax call the controller it sticks with the first 8 posts instead the 8 next one. Am i missing something or my code is wrong? Any help will be appreciate it.
推荐答案
在@Shan的帮助下，我发现了问题.
With @Shan help, i found the problem.
<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){
// :( no more articles
}else{
$('#grid').append(data.html);
}
},error: function(data){
},
})
}
</script>
public function index(Request $request)
{
$posts = Post::orderBy('created_at', 'desc')->paginate(8);
//$posts = Post::orderBy('created_at', 'desc')->limit(8)->get();
$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'));
}
在评论员帮助我解决这个问题的评论中，致谢@Shan.
The credits goes to @Shan, in the comment who helped me to solve this.
这篇关于Laravel:将更多数据从控制器加载到视图中的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！