Как выполняется обработка ошибок в новом Typeahead с Bloodhound?

У меня возникла проблема, из-за которой Typeahead просто перестает работать по истечении срока действия федеративного сеанса пользователя. Я хотел бы иметь возможность выполнять действие, когда «удаленный» вызов Typeahead терпит неудачу. Как это решается с помощью Typeahead, в частности? Есть ли какой-то обратный вызов «ошибка», как в типичном вызове ajax? Вот код, который у меня сейчас есть:

var hints = new Bloodhound({
    datumTokenizer: Bloodhound.tokenizers.obj.whitespace("value"),
    queryTokenizer: Bloodhound.tokenizers.whitespace,
    remote: {
        url: "/ProjectAssociation/CountryLookup?query=%QUERY",
        wildcard: "%QUERY"
    }
});
$("#assocStoragesSelection").typeahead(null, {
    name: "nations",
    limit: 90,
    valueKey: "ShortCode",
    displayKey: "Name",
    source: hints,
    templates: {
        empty: [
            "<div class='noitems'>",
            "No Items Found",
            "</div>"
        ].join("\n")
    }
});

javascript jquery typeahead.js typeahead bloodhound
person TheDude    schedule 04.04.2016    source источник
comment
В этом случае вам необходимо добавить данные проверки, возвращаемые с сервера;   -  person itzmukeshy7    schedule 18.04.2016
comment
Помог ли мой ответ?   -  person Ben Smith    schedule 18.04.2016

Ответы (3)


arrow_upward
2
arrow_downward

Typeahead Подсистеме предложений Bloodhound не хватает средств для информирования пользователя о проблемах с удаленным источником.

Вместо того, чтобы использовать Bloodhound для получения предложений, вы можете использовать параметр источника Typeahead (см. здесь). Указав здесь свой источник, вы сможете обрабатывать ошибки и отображать подходящее сообщение для пользователя.

Я создал пример здесь:

http://jsfiddle.net/Fresh/oqL0g7jh/

Ключевой частью ответа является исходный код опции, показанный ниже:

$('.typeahead').typeahead(null, {
  name: 'movies',
  display: 'value',
  source: function(query, syncResults, asyncResults) {
    $.get(_url + query, function(movies) {

      var results = $.map(movies.results, function(movie) {
        return {
          value: movie.original_title
        }
      });

      asyncResults(results);
    }).fail(function() {
      $('#error').text('Error occurred during request!');
      setTimeout("$('#error').text('');", 4000);
    });
}

Вариант источника использует метод jQuery get для извлечения данных. Любые возникающие ошибки обрабатываются методом fail отложенного объекта. В этом методе вы можете соответствующим образом обрабатывать любые ошибки и отображать подходящее сообщение для пользователя. Поскольку исходная функция указана с тремя параметрами, это заставляет Typeahead по умолчанию использовать этот вызов как асинхронный, следовательно, вызов:

asyncResults(results);
person Ben Smith    schedule 18.04.2016

arrow_upward
4
arrow_downward

«Правильный» способ обработки ошибок — это добавление обработчика ошибок к вызову AJAX с использованием функции prepare. Если вы используете опцию wildcard, обратите внимание, что prepare переопределяет ее.

Например, вы можете превратить это:

new Bloodhound({
    remote: {
        url: REMOTE_URL,
        wildcard: '%s'
    }
});

в это:

new Bloodhound({
    remote: {
        url: REMOTE_URL,
        prepare: function(query, settings) {
            return $.extend(settings, {
                url: settings.url.replace('%s', encodeURIComponent(query)),
                error: function(jqxhr, textStatus, errorThrown) {
                    // show error message
                },
                success: function(data, textStatus, jqxhr) {
                    // hide error message
                }
            });
        }
    }
});

Объект, возвращаемый prepare, используется в качестве объекта настроек для jQuery.ajax(), поэтому вы можете обратиться к его документации.

person Tobia    schedule 08.11.2016

arrow_upward
0
arrow_downward

попробуйте этот код

var hints = new Bloodhound({
    datumTokenizer: Bloodhound.tokenizers.obj.whitespace("value"),
    queryTokenizer: Bloodhound.tokenizers.whitespace,
    remote: {
        url: "/ProjectAssociation/CountryLookup?query=%QUERY",
        wildcard: "%QUERY",
        ajax: {
         error: function(jqXHR) {
          //do some thing
         }
    }
    }
});
person Mehdi    schedule 11.04.2016
comment
Ответ @BenSmith элегантен, но если этот работает, я считаю, что он самый лаконичный. - person Angel Joseph Piscola; 18.04.2016
comment
@AngelJosephPiscola Этот ответ не будет работать с последней версией Bloodhound. Опция «удаленный» не имеет опции «ajax». См. здесь - person Ben Smith; 18.04.2016
comment
Это отлично работает в 10.5... нашел это после нескольких часов поиска и множества других ответов, которые касались только пустых наборов результатов, в отличие от этого, который обрабатывает фактические ошибки, возвращаемые удаленным URL-адресом (401 и т. д.). - person byron; 10.09.2018