jQueryUom autocomplete - quando non viene restituito alcun risultato

Question

Mi chiedo come sia possibile rilevare e aggiungere un gestore personalizzato quando vengono restituiti risultati vuoti dal server quando si utilizza jQueryUI autocomplete.

Sembra che ci siano alcune domande su questo punto relative ai vari plugin jQuery (ad esempio jQuery autocomplete display “No data” error message when results empty), ma mi chiedo se c'è un modo migliore/più semplice per ottenere lo stesso con il completamento automatico jQueryUI.

Mi sembra che si tratti di un caso di uso comune e ho pensato che jQueryUI fosse migliorato con il completamento automatico di jQuery aggiungendo la possibilità di gestire in modo pulito questa situazione. Tuttavia non sono stato in grado di trovare la documentazione di tale funzionalità, e prima di incappare in questo mi piacerebbe buttare fuori alcuni tastatori nel caso in cui altri lo avessero visto prima.

Anche se probabilmente non è particolarmente influente, posso fare in modo che il server restituisca qualcosa - ad es. HTTP 204: No Content in una lista vuota 200/JSON - qualsiasi cosa renda più facile catturare il risultato nel completamento automatico di jQueryUI.

mio primo pensiero è passare un callback con due argomenti, vale a dire un oggetto di richiesta e un response callback per gestire il codice, per la documentazione:

La terza variazione, la richiamata, fornisce la massima flessibilità, e può essere utilizzato per connettere qualsiasi origine dati a Completamento automatico. Il callback ottiene due argomenti:

Un oggetto di richiesta, con una singola proprietà denominata "term", che si riferisce al valore attualmente nell'input di testo. Ad esempio, quando l'utente ha inserito "new yo" in un campo di città, il termine di completamento automatico sarà uguale a "new yo".

Un callback di risposta, che prevede che un singolo argomento contenga i dati da suggerire all'utente. Questi dati devono essere filtrati in base al termine fornito e possono essere in uno dei formati descritti sopra per dati locali semplici (Array di stringhe o Array di oggetti con etichetta/valore/entrambe le proprietà).

Quando il callback risposta riceve dati, si inserisce restituisce una speciale oggetto-array di una riga che ha un'etichetta e un indicatore che non sono presenti dati (modo di selezione/focus riconosce come l'indicatore che NO- i dati sono stati restituiti).

Questo sembra complicato. Preferirei essere in grado di utilizzare una fonte: "http: // ...", e solo avere una richiamata da qualche parte che indica che non è stato restituito alcun dato.

Grazie per la lettura.

Brian

EDIT:

Ecco una funzione wrapper che ho creato per risolvere questo problema, sulla base di @ ThiefMaster rassicurazione che sia il modo giusto per andare a questo proposito:

function autocomplete(input, source_url, on_select, on_focus, default_data) { 
     /* Autocompletion for an input field 
     * input: the field for autocompleting 
     * source_url: the JSON url for getting data 
     * on_select: function (event,ui) - when someone selects an element 
     * on_focus: function (event, ui) - when someone focuses an element 
     * default_data: function() returning default data; alternatively is the 
     *    default dataset e.g. {'label':'X','value':'Y'} 
     */ 

     $(input).autocomplete({ 
      source: function (request, response) { 
       $.ajax({ 
        url: source_url, 
        dataType: "json", 
        data: request, 
        success: function (data) { 
         if (!data.length) { // expect [] or "" 
          var def_data = typeof(default_data) == 'function' ? 
           default_data() : default_data; 
          response(def_data); 
         } else { 
          response(data); 
         } 
        } 
       }); 
      }, 
      minLength: 3, 
      select: on_select, 
      focus: on_focus, 
     }); 
    } 

Answer 1

La sovrascrittura della funzione response dell'oggetto autocompleter potrebbe funzionare, ma è monkeypatching. L'utilizzo della risposta callback è molto probabilmente il modo più pulito per ottenere ciò che desideri.

Answer 2

V'è un ottimo metodo qui: Detecting no results on jQuery UI autocomplete da Andrew Whittaker

spiegato bene e molto dolce.

Answer 3

E 'facile da maneggiare con response opzione

$('input.Srch').autocomplete({ 
    minLength: 3, 
    ....... 
    response: function(event, ui) { 
     if (!ui.content.length) { 
       var noResult = { value:"",label:"No results found" }; 
       ui.content.push(noResult); 
     } 
    } 
}); 

Ecco il mio screenshot: