JQuery autocomplete на стороне сервера

Question

Я пытаюсь настроить поле автозаполнения.

Я прочитал документацию JQuery UI, но все примеры предполагают, что источником является статический список элементов, из которых JQuery будет выбирать соответствующие записи (я имею в виду static = список завершен и не зависит от того, что пользователь набрал).

Вот код из примера «удаленного источника данных»:

$("#birds").autocomplete({ 
    source: "search.php", 
    ... 

Я хотел JQuery называть search.php?query=mytext (этот URL возвращает список соответствующих элементов), потому что мне нужно для поиска предложений в базе данных с использованием PHP.

Есть ли способ сделать это? Может, я не понял документацию?

Answer 1

из документации JQuery UI на автозаполнения:

Autocomplete может быть настроен для работы с различными источниками данных, просто указав опцию источника. Источник данных может быть:

• массив с локальными данными
• строка, указав URL
• обратный вызов

и далее вниз

Когда А String используется, плагин Autocomplete ожидает, что строка укажет на ресурс URL, который будет возвращать данные JSON. Он может находиться на одном и том же хосте или на другом (должен предоставить JSONP). Параметр запроса «term» добавлен в этот URL. Сами данные могут быть в том же формате, что и локальные данные, описанные выше.

Вы пробовали код, который вы указываете? он должен называть URL-адрес search.php? term = mytext

Answer 2

Well search.php может вернуть все, что захочет.

Для статического контента, который вы можете сделать что-то вроде этого:

$myList = array('pizza'=>array('mushrooms','pepperoni','olives')); 
echo json_encode($myList); 

Это не далеко от какого дб вызов даст вам.

Многие фреймворки в php возвращают ассоциативный массив после поиска из базы данных. Я считаю (как я помню) даже стандартные инструменты mysql, встроенные в php, делают то же самое (или что-то подобное).

json_encode/json_decode может помочь преобразовать все, что вы хотите, в php для json. Затем все, что вам нужно сделать, это эхо-сигнал, и автозаполнение ответит соответствующим образом.

Вы делаете это правильно. Вам просто нужно немного отформатировать его. Что вы в настоящее время выводите из search.php?

О, и я почти забыл, что вы, возможно, потребуется указать, что выход JSONP (хотя иногда вы можете уйти с не делать этого):

header('content-type: application/json; charset=utf-8'); 

Answer 3

Вот фрагмент кода на стороне клиента, который я написал некоторое время назад (изменено для защиты невинных!), которое делает именно то, что вам нужно ...

function ConfigureAutoComplete() { 

     $('#myautocomplete').autocomplete({ 
      type: "POST", 
      minLength: 3, 
      source : function (request, response) 
      {       
       var source_url = "../handlers/MyLookup.ashx?someparameter=" + $("#someparameter").val(); 

       $.ajax({ 
        url: source_url, 
        dataType: "json", 
        data: request, 
        success: function (data) { response(data); }, 
        error : function (a,b,c) { HandleLookUpError(a); } 
        }); 
      },     
      select: function (event, ui) { $('#result').val(ui.item.id); }    
     }); 
    } 

Как уже было сказано, ваша страница search.php может возвращать то, что вы хотите. Таким образом, вы можете сузить список на сервере и вернуть его клиенту, который затем позволит пользователю выбрать из этого списка.