Исключения пользовательского интерфейса блока jQuery

Question

Я использую JQuery UI плагин blockUI для блокировки пользовательского интерфейса для каждого запроса AJAX. Это работает как талисман, однако я не хочу блокировать пользовательский интерфейс (или, по крайней мере, не отображать сообщение "Пожалуйста, подождите"), когда я выполняю ajax-вызовы для получения предложений автозаполнения. Как я могу это сделать? Я использую плагин автозаполнения jquery для автозаполнения функциональности.

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

Answer 1

$('#myWidget').autocomplete({
    source: function(data, callback) {
        $.ajax({
            global: false,  // <-- this is the key!
            url: 'http:...',
            dataType: 'json',
            data: data,
            success: callback
        });
    }
});

Answer 2

Хм, похоже, отсутствует функция в jquery:) Вы можете использовать глобальный флаг, чтобы указать, является ли это вызов автозаполнения и обернуть его в общую функцию автозаполнения

    var isAutoComplete  = false;
    function autoComplete(autocomplete){
    isAutoComplete = true;
    if($(autocomplete).isfunction())
       autocomplete();
    }

        $(document).ajaxStart(function(){if(!isAutoComplete)$.blockUI();}).ajaxStop(function(){isAutoComplete = false;$.unblockUI();});

Это не хорошее решение, но оно должно работать...

Answer 3

Вы можете настроить blockUI для работы со всеми функциями на странице, добавив глобальный обработчик событий jQuery. Чтобы убедиться, что он не вызывается при автозаполнении вызовов ajax, мы должны определить, является ли вызов автозаполнением или нет. Проблема в том, что эти глобальные функции не имеют так много информации, доступной для них. Однако ajaxSend действительно получает некоторую информацию. Он получает объект настроек, используемый для вызова ajax. объект настроек имеет отправляемую строку данных. Поэтому то, что вы можете сделать, это добавить к каждой строке данных в каждом запросе ajax на вашей странице что-то вроде:

&notautocomplete=notautocomplete

Например:

$.ajax({data:"bar=1&foo=2&notautocomplete=notautocomplete"})

Затем мы можем поместить этот код в раздел "Готовые документы" прежде всего:

$(document).ajaxSend(
    function (event, xhr, ajaxOptions){
     if(ajaxOptions.data.indexOf("notautocomplete") !== -1){
         $.blockUI;
     }
});
$(document).ajaxStop($.unblockUI);

Конечно, другой лучшей идеей было бы искать что-то уникальное в запросах автозаполнения, например, URL, но это зависит от того, какой плагин автозаполнения вы используете и как вы его используете.

Answer 4

Попробуйте использовать декоратор

$.blockUI = function() {
    if (condition_you_dont_want_to_block) {
        return;
    }
    return $.blockUI.apply(this, arguments);
}

или вы можете написать свою собственную функцию блока, которая умнее

function my_blockUI() {
    if (condition_you_dont_want_to_block) {
        return;
    }
    $.blockUI();
}
$(document).ajaxStart(my_blockUI).ajaxStop($.unblockUI);

Answer 5

Использование модального блока (блочного пользовательского интерфейса) означает блокирование любых вводов от пользователя, я бы предложил обычному старому пульсирующему модулю показать "Пожалуйста, подождите.." и заблокировать (установить атрибуты readonly="readonly") свои элементы управления вводом до тех пор, пока запрос ajax не будет полный.

Вышеупомянутый пользовательский интерфейс кажется противоречивым!