Why am I getting HTML response from jquery ajax call - php

Question

I am trying to use jQuery UI autocomplete in my Laravel project to show some suggestions as the user is typing in. Here is the script triggered when the user types in:
$(".autocomplete").autocomplete({
source: function(request, response) {
$.ajax({
url: '/autocomplete',
dataType: "json",
data: {
term : request.term,
field : $(this.element).prop("id")
},
success: function(data) {
console.log(data);
response(data);
},
error: function(result, status, error) {
console.log(result);
console.log(status);
console.log(error);
}
});
},
min_length: 0, });
Here is my route in web.php
Route::get('/autocomplete', 'SitesController#autocomplete');
And finally my controller which retrieves results from the database.
public function autocomplete(Request $request) {
$term = \Request::get('term');
$field = \Request::get('field');
$sites = Site::where($field, 'ILIKE', '%'.$term.'%')
->distinct()
->get([$field]);
$data = [];
foreach($sites as $key => $site) {
$data[] = $site->$field;
}
return \Response::json($data);
}
This is currently not working, but when I directly add the above code to my route files, it does work well.
Route::get('/autocomplete', function()
{
$term = \Request::get('term');
$field = \Request::get('field');
$sites = Site::where($field, 'ILIKE', '%'.$term.'%')
->distinct()
->get([$field]);
$data = [];
foreach($sites as $key => $site) {
$data[] = $site->$field;
}
return \Response::json($data);
});
My script is returning a HTML response, and here is the error I get from the console:
SyntaxError: Unexpected token < in JSON at position 0
at parse (<anonymous>)
at ajaxConvert (VM258 app.js:18060)
at done (VM258 app.js:18530)
at XMLHttpRequest.<anonymous> (VM258 app.js:18832)
I can't see why my script is not returning JSON but HTML, while it does when I put my script in the web.php file.

Answer 1

As suggested by aynber, looking closely at the returned HTML page, I realized it was an error page that I throw thanks to a middleware, when someone is trying to access a page without having the rights. And my controller was of course checking for this middleware first. I made an exception for the autocomplete function and now everything is working fine, though I feel I'm not handling my middlewares the good way...

Answer 2

in app/Exceptions/Handler.php file you can do something like this
public function render($request, Exception $e)
{
if ($request->wantsJson()) {
$response = ... // put your response data here
return response()->json($response);
}
...
}