Использование автозаполнения jQuery с нестандартными параметрами? - PullRequest
Новая
       4

Использование автозаполнения jQuery с нестандартными параметрами?

0 голосов
/ 04 ноября 2011

Я бы хотел использовать автозавершение jQuery в проекте Drupal для автоматического поиска узлов (фрагментов контента) с заданным заголовком. Я не могу найти примеры использования опций, которые соответствуют тому, что я пытаюсь сделать, а именно:

  1. URL должен соответствовать шаблону: / api / node / title / {независимо от того, что пользователь ввел}
  2. Когда результаты возвращаются в формате JSON, заголовок необходимо использовать в списке автозаполнения
  3. При нажатии на результат над текстовым полем появится стилизованный абзац с заголовком, но на самом деле он будет содержать идентификатор узла (nid) выбранного узла.

Вот что у меня есть: 

jQuery(this).autocomplete({
    source: '/api/node/title/'+jQuery(this).val(),
    minLength: 2
}).data( "autocomplete")._renderItem = function(ul, item) {
    return jQuery('<li />')
        .data("item.autocomplete", item)
        .appendTo(ul);
};

Я даже не стал беспокоиться о том, что делать после выбора элемента - URL-адрес выглядит как / api / node / title? Term = {blank}, и хотя я получаю результаты JSON обратно, ничего не появляется Любые предложения или примеры аналогичного использования? Примеры для автозаполнения на веб-сайте jQuery UI не были особенно полезны.

РЕДАКТИРОВАТЬ: Вот пример ожидаемого ответа. 

{
    "nid":"2",
    "vid":"2",
    "type":"lorem",
    "language":"und",
    "title":"Grid Computing",
    "uid":"0",
    "status":"1",
    "created":"1320092886",
    "changed":"1320273538",
    "comment":"1",
    "promote":"1",
    "sticky":"0",
    "tnid":"0",
    "translate":"0"
}

1 Ответ

4 голосов
/ 04 ноября 2011

для 1), вы можете использовать обратный вызов для источника 

$('input').autocomplete({
    source: autoDrupal,
    minLength: 2});

function autoDrupal(requestObject, responseCallback) {
   var url = '/api/node/title/' + requestObject.term;
   $.get(url, function(data) {
       // check my fiddle to transform drupal response in autocomplete result ;)
       responseCallback(data);
   });
};

для 2) Я не понимаю, что вы подразумеваете под «заголовком», но это, безусловно, может быть обработано в ответе $ .get для 3) обработчик событий может сделать свое дело (как только я понимаю ваш страшный "заголовок"). как то так: 

$('ul.ui-autocomplete').delegate('li', 'click', function () {
    $('#stuff').css('color', 'red');
})

проверьте и играйте с этой скрипкой;)

...