Wie wird die Fehlerbehandlung mit der neuen Typeahead mit Bloodhound durchgeführt?

Question

Ich habe ein Problem, bei dem TypeAhead einfach nicht mehr funktioniert, wenn die föderierte Benutzersitzung abläuft. Ich möchte eine Aktion durchführen können, wenn der "Remote" -Aufruf für TypeAhead fehlschlägt. Wie wird dies insbesondere mit Typeahead gehandhabt? Gibt es eine Art "Fehler" -Rückruf, wie Sie ihn in einem typischen Ajax-Anruf finden würden? Hier ist der Code, den ich derzeit haben:

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") 
    } 
}); 

Answer 1

Typeahead'sBloodhound Vorschlag Motor in Einrichtungen fehlt den Benutzer zu informieren, wenn es ein Problem mit einer entfernten Quelle ist.

Anstatt Bloodhound zu verwenden, um die Vorschläge zu erhalten, können Sie stattdessen die Source-Option von Typeahead verwenden (siehe here). Indem Sie hier Ihre Quelle angeben, können Sie Fehler behandeln und dem Benutzer eine geeignete Nachricht anzeigen.

Ich habe hier ein Beispiel erstellt:

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

Der wichtigste Teil der Antwort ist Quelle Optionscode unten dargestellt:

$('.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); 
    }); 
} 

Die Quelle Option ist die Nutzung von jQuery-get Methode zum Abrufen der Daten. Alle auftretenden Fehler werden von der fehlgeschlagenen Methode des verzögerten Objekts behandelt. In dieser Methode können Sie Fehler angemessen behandeln und dem Benutzer eine geeignete Nachricht anzeigen. Da die Quellenfunktion mit drei Parametern festgelegt ist, bewirkt dies typeahead diesen Aufruf als asynchroner auf Standard, damit der Anruf an:

asyncResults(results); 

Answer 2

versuchen diesen Code

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 
     } 
    } 
    } 
}); 

Answer 3

die „richtige“ Art und Weise Fehler zu behandeln ist, eine Fehlerbehandlungsroutine zum Aufruf AJAX Hinzufügen, Verwenden der prepare Funktion. Wenn Sie die Option wildcard verwenden, beachten Sie, dass prepare dies überschreibt.

Zum Beispiel können Sie das einschalten:

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

in diese:

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 
       } 
      }); 
     } 
    } 
}); 

Das zurückgegebene Objekt von prepare verwendet wird als ein Einstellungsobjekt für jQuery.ajax() so können Sie auf its documentation beziehen.