用ajax显示帖子 - 使用未定义的常量postObj - 假设' postObj'

时间:2018-03-24 15:30:23

标签: javascript php laravel laravel-5 blade

我有一个主页,其中有一些菜单包含一些类别,下面有最新帖子:

<ul class="Categories__Menu"> 
    @foreach($categories->take(6) as $category)
        <li class="ative">
            <a href="" name="category" id="{{$category->id}}">{{$category->name}}</a>
        </li>
    @endforeach
</ul>

<div class="row" id="posts">
 @foreach($posts as $post)
<div class="col-12 col-sm-6 col-lg-4 col-xl-3 mb-4">
    <div class="card">
        <img class="card-img-top" src="{{$post->image}}" alt="Card image cap">
        <h5 class="card-title">{{$post->name}}</h5>
        <div class="card-footer d-flex justify-content-between align-items-center">
            <a href="{{route('posts.show', ['id' => $post->id, 'slug' => $post->slug])}}" class="btn btn-primary text-white">More</a>
        </div>
    </div>
</div>
@endforeach
</div>

我希望在点击每个类别时,仅在主页中显示该类别的帖子,但在同一主页中,而不是在特定类别页面中。

所以我有这个Ajax:

$(function() {
    $("a[name='category']").on('click', function(){
        var category_id = $(this).attr("id");
        $.ajax({
            url: '{{ route('category.posts',null) }}/' + category_id,
            type: 'GET',
            success:function(result){

                $('#posts').empty();
                $.each(result,function(index, postObj){
                    $('#posts').append("<p>"+postObj.name+"</p>");
                });
                console.log(result);
            },
            error: function(error) {
                console.log(error.status)
            }
        });

    });
});

它的工作正常,但不是只显示:

                $('#posts').append("<p>"+postObj.name+"</p>");

我想用上面的真实html显示帖子,如:

<div class="col-12 col-sm-6 col-lg-4 col-xl-3 mb-4">
        <div class="card">
            <img class="card-img-top" src="{{$post->image}}" alt="Card image cap">
            <h5 class="card-title">{{$post->name}}</h5>
            <div class="card-footer d-flex justify-content-between align-items-center">
                <a href="{{route('posts.show', ['id' => $post->id, 'slug' => $post->slug])}}" class="btn btn-primary text-white">More</a>
            </div>
        </div>
    </div>

所以我在ajax中使用这样的东西:

$("a[name='category']").on('click', function(){

                var category_id = $(this).attr("id");
                alert(category_id);

                $.ajax({

                    url: '{{ route('category.posts',null) }}/' + category_id,
                    type: 'GET',
                    success:function(result){

                        $('#posts').empty();
                        $.each(result,function(index, postObj){
                            //$('#posts').append("<p>"+postObj.name+"</p>");
                            $('#posts').append("<div class=\"col-12 col-sm-6 col-lg-4 col-xl-3 mb-4\">\n" +
    "                        <div class=\"card box-shaddow\">\n" +
    "                            <img class=\"card-img-top\" src=\"{{postObj.image}}\" alt=\"Card image cap\">\n" +
    "                                <h5 class=\"card-title h6 font-weight-bold text-heading-blue\">{{postObj.name}}</h5>\n" +
    "                            <div class=\"card-footer d-flex justify-content-between align-items-center\">\n" +
    "\n" +
    "                                <a href=\"{{route('posts.show', ['id' => postObj.id, 'slug' => postObj.slug])}}\" class=\"btn btn-primary text-white\">More</a>\n" +
    "                            </div>\n" +
    "                        </div>\n" +
    "                    </div>");
                        });
                        console.log(result);
                    },
                    error: function(error) {
                        console.log(error.status)
                    }
                });

            });

但这似乎是一个错误:

Use of undefined constant postObj - assumed 'postObj'

你知道为什么吗?

PostController中:

public function WhereHasCategory(Request $request)
    {
        $posts = Post::whereHas('categories', function ($categories) use (&$request) {
            $categories->where('id',$request->id);
        })->get();

        return response()->json($posts);
    }

路由到ajax部分:

Route::get('posts/where/category/{id}','\PostController@WhereHasCategory')->name('category.posts');

返回主页视图的方法:

public function index(){
        return view('home')
            ->with('categories', Category::orderBy('created_at', 'desc')->get())
            ->with('posts', Post::orderBy('created_at','desc')->take(8)->get());
    }

1 个答案:

答案 0 :(得分:0)

确保使用 $ postObj 引用Blade模板中的变量,而不是 postObj 。我可以看到你在 $ 中使用它,例如 标记中的 postObj.image