Ajax get is not working - Internal Server Error - php

Question

I have a homepage where there is a menu with some categories and below there are the latest 10 posts.
A post can have many categories and one category can belong to many posts so there are 2 models and a pivot table "category_post" with 2 columns: id and name.
So in the homepage, there is a menu with some categories and below the posts:
<ul class="Categories__Menu">
#foreach($categories->take(6) as $category)
<li class="ative">
{{$category->name}}
</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">
More
</div>
</div>
</div>
#endforeach
</div>
I want that when each category is clicked to show only the posts of that category in the homepage, but in the same homepage, not in a specific category page. So maybe the best approach is using AJAX.
But Im getting an error accessing "http://proj.test/posts/where/category/5"
ReflectionException (-1)
Class PostController does not exist
Or when I click in a category in the menu it appears in the console:
GET http://proj.test/posts/where/category/5 500 (Internal Server Error)
Do you know where is the issue?
The code:
In the FrontController I already pass the categories and posts to the homepage view:
FrontController:
class FrontController extends Controller
public function index(){
return view('home')
->with('categories', Category::orderBy('created_at', 'desc')->get())
->with('posts', Post::orderBy('created_at','desc')->take(10)->get());
}
}
Post and Category models:
class Post extends Model
{
public function categories(){
return $this->belongsToMany('App\Category');
}
}
class Category extends Model
{
public function posts(){
return $this->belongsToMany('App\Post');
}
}
PostController:
public function WhereHasCategory(Request $request)
{
$posts = Post::whereHas('categories', function ($categories) use (&$request) {
$categories->where('id',$request->id);
})->get();
return response()->json($posts);
}
Route to the homepage:
Route::get('/', [
'uses' => 'FrontController#index',
'as' =>'index'
]);
Route to the ajax part:
Route::get('posts/where/category/{id}','\PostController#WhereHasCategory')->name('category.posts');
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.title+"</p>");
});
console.log(result);
},
error: function(error) {
console.log(error.status)
}
});
});
});

Answer 1

You've defined the class wrong in the ajax route.
Route::get(
'posts/where/category/{id}',
'\PostController#WhereHasCategory'
)->name('category.posts');
You've put the controller as \PostController when I imagine it's App\Http\Controllers\PostController. When you prefix the class with \ it tells it that it's in the global scope, with no namespace. Remove the \.