JQuery UI автозаполнения времени - PullRequest
2 голосов
/ 23 апреля 2011

Мне нужно вернуть числовой идентификатор для выбора, но отобразить имя клиента в словах.У меня есть скрытое поле для идентификатора клиента и текстовый ввод для отображаемого имени.Это вроде работает, но я бы предпочел улучшить взаимодействие с пользователем.

Запрос ajax возвращает список клиентов в переменных данных, которые используются для построения массива объектов, в соответствии с документами:

values = [];
$.each(data, function(index, guest) {
    values.push({label: guest, value: index});
});

Затем я связываю автозаполнение с полем формы:

$( "#customer" + numRand ).autocomplete({
    source: values,
    minLength: 2,
    select: function (event, ui) {      // set hidden field with index of selection
        $( "#customerId" + numRand ).val(ui.item['value']);
    },
    change: function (event, ui) {      // restore word label to input field
        $( "#customer" + numRand ).val(ui.item['label']);
    }
});

NumRand предназначен для создания полууниверсальных идентификаторов, потому что в этом приложении форма загружается в диалоговом окне пользовательского интерфейса JQuery и сохраняетсяв противном случае значений между экземплярами.

Я пытался использовать событие change вместо close , но результат тот же. * Когдакак минимум две буквы были введены в поле формы, меню отображается правильно, с отображением имен.Когда имя выбрано, числовой индекс попадает в поле формы.Когда фокус перемещается на любую другую часть страницы (щелчок по фону работает), числовой индекс заменяется именем клиента по желанию.Я хочу, чтобы имя также отображалось изначально.

Есть предложения, как получить имя, отображаемое при выборе?(Я попытался поместить его в этот обработчик, но он сразу же перезаписывается идентификатором, который остается там, когда фокус перемещается).

Заранее благодарен за любые предложения.

* РЕДАКТИРОВАТЬ - я был неправ,событие close , как и событие select , переопределяется встроенным методом.

UPDATE: решение простое: используйте select событие и переопределить встроенный метод, возвращая false:

$( "#customer" + numRand ).autocomplete({
    source: values,
     minLength: 2,
     select: function (event, ui) {      
        $( "#customerId" + numRand ).val(ui.item['value']);
        $( "#customer" + numRand ).val(ui.item['label']);
        return false;
    }
});

1 Ответ

0 голосов
/ 24 апреля 2011

Решение простое: используйте событие select и переопределите встроенный метод, вернув false:

$( "#customer" + numRand ).autocomplete({
   source: values,
   minLength: 2,
   select: function (event, ui) {      
      $( "#customerId" + numRand ).val(ui.item.value);
      $( "#customer" + numRand ).val(ui.item.label);
      return false;
  }
});
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...