Проблема автозаполнения jQuery - не совпадает, если пользователь не выбрал - PullRequest
Новая
       5

Проблема автозаполнения jQuery - не совпадает, если пользователь не выбрал

3 голосов
/ 23 июля 2010

Исходя из двух моих предыдущих вопросов:

Как сделать так, чтобы автозаполнение jQuery выполняло поиск (), когда пользователь нажимает "Отправить"

Как мне обрезатьвход в поле автозаполнения JQuery?

В моей форме есть поле автозаполнения jQuery UI 1.8, и по большей части оно работает как шарм.Единственная проблема, с которой я столкнулся, заключается в том, что если я ввожу правильное имя, но не выбираю вариант, который отображается , то имя никогда не сопоставляется с моим списком {name,value} и, следовательно, правильным значением для скрытого вводакоторая содержит часть 'value' не установлена.Это, конечно, приводит к запутанной ситуации, когда можно ввести правильное имя, нажать «Отправить» и получить сообщение, что вы не ввели правильное имя (значение null).

Как я могуубедитесь, что значение скрытого ввода установлено, даже если пользователь не делает выбор из поля автозаполнения?Есть ли какая-нибудь функция, которую я могу привязать к событию onclick кнопки отправки, которая заставит jQuery выполнить поиск по содержимому в поле и автоматически выбрать первый вариант?В качестве альтернативы, можно ли сделать так, чтобы автозаполнение выбрало первую опцию, когда пользователь каким-либо образом отменит выбор поля ввода (возврат / вкладка / отключение / и т. Д.)?

Спасибо.

1 Ответ

3 голосов
/ 23 июля 2010

Вот мое решение вашей проблемы. Я только что добавил часть, касающуюся события change . Надеюсь, это поможет. 

jQuery(function(){
    jQuery('#Resource').autocomplete({
        source: data,
        focus: function(event, ui) {
            jQuery('#Resource').val(ui.item.label);
            return false;
        },          
        select: function(event, ui) {
            jQuery('#Resource').val(ui.item.label);
            jQuery('#EmployeeNumber').val(ui.item.value);
            return false;
        },
        change: function(event,ui){
                for (var i in data){
                    if (data[i].label==jQuery('#Resource').val()){
                        jQuery('#EmployeeNumber').val(data[i].value);
                    }
                }
        }
    });
});
...