ExtJS 4 ComboBox completamento automatico

Question

ho un combobox extjs utilizzata per il completamento automatico seguente configurazione avere:

xtype:'combo', 
displayField: 'name', 
valueField:'id', 
store: storeVar, 
queryMode: 'remote', 
minChars:2, 
hideTrigger:true, 
forceSelection:true, 
typeAhead:true 

ci sono due questioni di essere affrontati da me:

a. Se un utente sceglie un valore dall'elenco restituito dal server, ma in seguito desidera rimuovere tale valore e mantenere la casella combinata vuota, anche i vecchi valori vengono visualizzati nuovamente su sfocatura, non consentendo alla casella combinata di rimanere vuota. Come posso consentire il valore vuoto in questa casella combinata in questo caso? Capisco che potrebbe essere dovuto a forceSelection: true, ma poi ho bisogno di mantenerlo vero altrimenti l'utente può digitare qualsiasi valore casuale.

b. Quando il server restituisce una lista vuota, voglio visualizzare un messaggio - Nessun valore trovato. Ho provato a farlo, inserendo questo valore nell'entità displayField, ad es. {Id: '', nome: 'Nessun valore trovato'}. Ma in questo caso, l'utente è in grado di scegliere questo valore e inviarlo al server che non è quello che ci si aspetta. Quindi, come posso visualizzare il messaggio per la lista vuota?

Qualcuno potrebbe far luce su questo?

Answer 1

Per il problema relativo alla forceSelection nella domanda precedente, che segue è l'hack creato che può servire allo scopo previsto:

Ext.override(Ext.form.field.ComboBox,{   
    assertValue: function() { 
     var me = this, 
      value = me.getRawValue(), 
      rec; 
     if (me.multiSelect) { 
      // For multiselect, check that the current displayed value matches the current 
      // selection, if it does not then revert to the most recent selection. 
      if (value !== me.getDisplayValue()) { 
       me.setValue(me.lastSelection); 
      } 
     } else { 
      // For single-select, match the displayed value to a record and select it, 
      // if it does not match a record then revert to the most recent selection. 
      rec = me.findRecordByDisplay(value); 
      if (rec) { 
       me.select(rec); 
      } else { 
       if(!value){ 
        me.setValue(''); 
       }else{ 
        me.setValue(me.lastSelection); 
       } 
      } 
     } 
     me.collapse(); 
    } 
}); 

Questo deve essere inclusa dopo sono stati inclusi i file di libreria di ExtJS.

Per l'altro problema del messaggio da visualizzare su Nessun valore trovato - emptyText - funziona correttamente come suggerito da Varun.

Spero che questo aiuti qualcuno a cercare qualcosa di simile.

Answer 2

Ho fatto questo per Ext JS 3.3.1. Non so se si applicano a Ext JS 4, anche se penso che dovrebbero.

Per il primo problema, impostare autoSelect : false. autoSelect è impostato di default su true. Funzionerà solo se è impostato allowBlank : true. Dai documenti

true per selezionare il primo risultato raccolto dall'archivio dati (valore predefinito true). Un valore falso richiederebbe una selezione manuale dall'elenco a discesa per impostare il valore dei componenti a meno che il valore di (typeAheadDelay) fosse true.

Per il secondo problema, utilizzare listEmptyText. Dai documenti

Il testo vuoto da visualizzare nella visualizzazione dati se non vengono trovati elementi. (predefinito su '')

Cheers.