jQuery AutoComplete выбрать стрельбу после изменения? - PullRequest
Новая
       6

jQuery AutoComplete выбрать стрельбу после изменения?

5 голосов
/ 20 мая 2010

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

В настоящее время я реализую это с помощью события выбора автозаполнения, устанавливающего скрытый идентификатор, и затем события изменения в текстовом поле, которое устанавливает значение текстового поля и, если необходимо, вызывает обратную запись.

Если пользователь просто использует клавиатуру, это работает отлично. Вы можете ввести, использовать стрелки вверх и вниз для выбора значения, а затем вкладку для выхода. Событие select срабатывает, идентификатор устанавливается, а затем происходит событие изменения, и страница отправляется обратно.

Если пользователь начинает печатать, а затем с помощью мыши выбирает параметры автозаполнения, происходит событие изменения (когда фокус перемещается в меню автозаполнения?), И страница отправляется назад, прежде чем событие выбора сможет установить ID.

Есть ли способ заставить событие изменения не срабатывать до окончания события select, даже если используется мышь? 

$(function() {
    var txtAutoComp_cache = {};
    var txtAutoComp_current = { label: $('#txtAutoComp').val(), id: $('#hiddenAutoComp_ID').val() };
    $('#txtAutoComp').change(function() {
        if (this.value == '') { txtAutoComp_current = null; }
        if (txtAutoComp_current) {
            this.value = txtAutoComp_current.label ? txtAutoComp_current.label : txtAutoComp_current;
            $('#hiddenAutoComp_ID').val(txtAutoComp_current.id ? txtAutoComp_current.id : txtAutoComp_current);
        } else {
            this.value = '';
            $('#hiddenAutoComp_ID').val('');
        }
        // Postback goes here
    });
    $('#txtAutoComp').autocomplete({
        source: function(request, response) {
            var jsonReq = '{ "prefixText": "' + request.term.replace('\\', '\\\\').replace('"', '\\"') + '", "count": 0 }';
            if (txtAutoComp_cache.req == jsonReq && txtAutoComp_cache.content) {
                response(txtAutoComp_cache.content);
                return;
            }
            $.ajax({
                url: 'ajaxLookup.asmx/CatLookup',
                contentType: 'application/json; charset=utf-8',
                dataType: 'json',
                data: jsonReq,
                type: 'POST',
                success: function(data) {
                    txtAutoComp_cache.req = jsonReq;
                    txtAutoComp_cache.content = data.d;
                    response(data.d);
                    if (data.d && data.d[0]) { txtAutoComp_current = data.d[0]; }
                }
            });
        },
        select: function(event, ui) {
            if (ui.item) { txtAutoComp_current = ui.item; }
            $('#hiddenAutoComp_ID').val(ui.item ? ui.item.id : '');
        }
    });
});

Ответы [ 3 ]

3 голосов
/ 18 января 2011

Вы можете решить эту проблему, внедрив событие изменения в качестве опции автозаполнения, например select, вместо использования функции change () jQuery.

Вы можете увидеть список событий на странице демонстрации и документации автозаполнения . В нем говорится, что событие change всегда вызывается после события close, которое, как я предполагаю, вызывается после события select. Взгляните на источник 'combobox', чтобы увидеть пример перехвата события изменения.

1 голос
/ 26 июля 2011

Это сработало для меня при выборе мыши, когда я сделал это: 

focus: function (event, ui) {
                       $j(".tb").val(ui.item.value);
                       return true;
                    }

Это приводит к изменению текста TextBox на событиях фокусировки мыши, так же, как это происходит на событиях клавиатуры. И когда мы выбираем элемент, это вызывает изменение выбора.

0 голосов
/ 20 мая 2010

Я не знаю, как предотвратить запуск события изменения, но вы могли бы легко добавить некоторые условия в ваше событие изменения, которое гарантирует, что скрытое поле установлено и что TextBox в настоящее время имеет значение a .

...