JQuery UI автозаполнение: срабатывает, только если элемент не выбран - PullRequest
Новая
       17

JQuery UI автозаполнение: срабатывает, только если элемент не выбран

5 голосов
/ 16 сентября 2011

Я пытаюсь выяснить, как сделать "противоположность" выбора jquery ui. Когда кто-то не выбирает опцию и просто набирает «jquery что-то», вывод будет: msgstr "новый ввод: jquery что-то". Однако, когда выбрано «jquery», было бы неплохо как-то только «выбрать из списка: jquery» и предотвратить распространение нажатия клавиш. Тем не менее, оба события происходят. Я пытаюсь сделать это один или другой. 

<input class="test" type="text" />

<script>
$('.test').autocomplete({
    select: function (event, ui) {
        alert('selected from list: ' + ui.item.label);
        event.preventDefault();
        return false;
    },
    source: ["jquery", "jquery ui", "sizzle"]
});
$('.test').live('keypress', function (e) {
    if ((e.which && e.which == 13) || (e.keyCode && e.keyCode == 13)) {
        alert('new input: ' + $(this).val());
    }
});
</script>

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

1 Ответ

10 голосов
/ 17 сентября 2011

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

$("#auto").autocomplete({
    source: ['hi', 'bye', 'foo', 'bar'],
    change: function(event, ui) {
        console.log(this.value);
        if (ui.item == null) {
            $("span").text("new item: " + this.value);
        } else {
            $("span").text("selected item: " + ui.item.value);
        }
    }
});

Пример: http://jsfiddle.net/Ne9FH/

...