Как использовать автозаполнение JQuery для нескольких слов

Question

У меня есть поле автозаполнения, и мне просто интересно, как я могу его использовать за несколько слов? Когда я набираю первое слово, оно работает идеально, но когда я пробел и введите второе слово, он отправляет два слова обратно на сервер и, конечно, результаты неверны!

например. когда я набираю два слова,

'Java javascript'

первое слово 'Java', автозаполнение работает хорошо, вытащите список.

но когда я делаю пробел и набираю javascript, автозаполнение отправляет 'Java + javascript к моей функции ajax.

Есть идеи, как это исправить?

Answer 1

Если вы используете версию автозаполнения "bassistance", она встроена. Но если вы используете версию пользовательского интерфейса jQuery, здесь есть пример:

http://jqueryui.com/demos/autocomplete/#multiple

Answer 2

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

Однако я скачал и использую внешнюю версию, доступную здесь :

http://bassistance.de/jquery-plugins/jquery-plugin-autocomplete/

это немного больше, но использование точно такое же, вам не нужно ничего менять, для множественного выбора, добавьте в опции {множественное: истина}

Обновление

JQueryUI теперь обновлен для самых новых версий, что делает этот ответ устаревшим. Пример обновления можно найти здесь

http://jqueryui.com/demos/autocomplete/#multiple

Answer 3

$("#tagnames").autocomplete("/tags/filter", {
        max: 6,
        highlightItem: true,
        multiple: true,
        multipleSeparator: " ", 
  })

Чтобы включить автозаполнение для нескольких слов, вы должны установить параметры несколько: истина и multipSeparator: ""

Answer 4

Добавляя комментарий для более полного ответа, допустим, у вас есть два возможных варианта выбора с общим префиксом:

ip5 , батарея ip5

если пользователь вводит в текстовое поле ip5, первый вариант выше автоматически выбирается, не позволяя пользователю продолжать вводить второй вариант, чтобы избежать такого поведения, убедитесь, что вы используете опцию

triggerSelectOnValidInput: true,