Как использовать автозаполнение jQuery (= живой поиск) с контроллером Laravel

Question

Это (часть) моего представления, созданного Laravel Forms :

<form method="POST" action="http://laravelapp/search" accept-charset="UTF-8">
    <input name="_token" type="hidden" value="g3RA...">
    <input type="text" placeholder="Search" id="terms">
</form>

<script>
$( function() {
    var testdata = [ "ActionScript", "AppleScript", "JavaScript" ];
    $( "#terms" ).autocomplete({
        minLength: 1,
        source: '{{ URL::route('index.search') }}'
        //source: testdata
    });
});
</script>

Это маршрут для index.search:

Route::post('/search', 'IndexController@search')->name('index.search');

Это мой IndexController:

public function search(Request $request)
{
   return Response('Hello World');
}

Ради простоты я заменил фактический алгоритм поиска статическим ответом Hello World. Однако автозаполнение работает нормально, если я раскомментирую строку //source: testdata в коде javascript. Когда я использую маршрут к IndexController, ничего не происходит.

Когда я нажимаю клавишу ввода (= отправить форму), новая страница загружается с Hello World, но результаты динамического поиска отсутствуют.

Как видите, я вставил токен CSRF, а метод search() возвращает действительный ответ. Тем не менее, это не вызвано JavaScript. Мои вопросы, таким образом:

• Что не так с моим кодом?
• Должен ли маршрут быть GET или POST?
• Должна ли быть форма вокруг поля ввода? В обычных демонстрационных примерах jQuery его нет, но, вероятно, он необходим для защиты CSRF.

Любая помощь очень ценится!

Answer 1

Автозаполнение ожидает, что его источником будет массив данных. По умолчанию способ ответить клиенту обратно в формате json. Вам следует попытаться изменить конечную точку, чтобы она не только возвращала массив, но и кодировала этот массив в формат json, чтобы программа автозаполнения знала, как с ней обращаться.