ExtJS ComboBox 4 Autocompletar

Question

que tienen un cuadro combinado extjs utilizado para la configuración después de tener la función de autocompletar:

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

Hay dos cuestiones que enfrenta mí:

a. Si un usuario elige un valor de la lista devuelta por el servidor, pero luego quiere eliminar ese valor y mantener el cuadro combinado vacío, también los valores anteriores vuelven a aparecer en el desenfoque, sin permitir que el cuadro combinado permanezca vacío. ¿Cómo puedo permitir el valor vacío en este cuadro combinado en tal caso? Entiendo que podría deberse a forceSelection: verdadero, pero luego debo mantenerlo cierto ya que de lo contrario el usuario puede escribir cualquier valor aleatorio.

b. Cuando el servidor devuelve una lista vacía, quiero mostrar un mensaje - No se encontraron valores. Intenté hacer esto, poniendo este valor en la entidad displayField, es decir, {id: '', nombre: 'No se encontró el valor'}. Pero en este caso, el usuario puede elegir este valor y enviarlo al servidor, que no es lo que se espera. Por lo tanto, ¿cómo puedo mostrar el mensaje para la lista vacía?

¿Podría alguien aclarar esto?

Answer 1

Para el tema relacionado con forceSelection en la pregunta anterior, siguiente es el hack creado que puede servir a la finalidad prevista:

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

Esto debe ser incluido después se han incluido archivos de la biblioteca de extjs.

Para que el otro problema de mensaje se muestre en Sin valores encontrados, emptyText, funciona bien como lo sugiere Varun.

Espero que esto ayude a alguien a buscar algo similar.

Answer 2

He hecho esto para Ext JS 3.3.1. No sé si se aplican a Ext JS 4, aunque creo que deberían.

Para el primer problema, configure autoSelect : false. autoSelect se establece de manera predeterminada en true. Esto solo funcionará si se establece allowBlank : true. De los documentos

true para seleccionar el primer resultado recopilado por el almacén de datos (predeterminado en verdadero). Un valor falso requeriría una selección manual de la lista desplegable para establecer el valor de los componentes a menos que el valor de (typeAheadDelay) fuera verdadero.

Para el segundo problema, utilice listEmptyText. De los documentos

El texto vacío para mostrar en la vista de datos si no se encuentran elementos. (predeterminado a '')

Cheers.