ExtJS 4.1: ¿cómo configurar un elemento preseleccionado en un cuadro combinado?

Estoy trabajando con ExtJS 4.1, necesito crear un cuadro combinado que contenga una lista de clientes y me gustaría establecer un elemento preseleccionado específico en él, pero no sé cómo hacerlo. Aquí está el código para crear mi cuadro combinado:

xtype: 'combobox',
fieldLabel: 'customer',
name: 'customer_id',
allowBlank:false,
afterLabelTextTpl: required,
//data store
store: Ext.create('Ext.data.Store', {
    autoDestroy: true,
    model: 'customer_model',
    autoLoad: true,
    proxy: {
        type: 'ajax',
    url: 'load.php?item=customer',            
    reader: {
        type: 'json',
        successProperty: 'success',
        root: 'data'
    }
    }
}),
valueField: 'id',
displayField: 'company',
typeAhead: true,
queryMode: 'remote',
emptyText: ''

Como puede ver, mi cuadro combinado está lleno de un almacén de datos, ese almacén de datos se basa en un modelo de datos llamado 'modelo_cliente'. Aquí está el código para el modelo de datos:

Ext.define('customer_model', {
    extend: 'Ext.data.Model',
    fields: [
        {type: 'int', name: 'id'},
        {type: 'string', name: 'company'},
        {type: 'string', name: 'vat'},
        {type: 'string', name: 'ssn'},
        {type: 'int', name: 'ref_id'}
    ]
}); 

Bueno, me gustaría configurar mi cuadro combinado para que un determinado elemento, por ejemplo, el cliente que tiene una identificación igual a 1, se seleccione automáticamente cuando se carga la página. Alguien puede ayudarme ? Gracias por adelantado. Enrique.

preguntado el 12 de junio de 12 a las 16:06

5 Respuestas

En Ext.js 3.2.1, puede hacer esto:

combobox.setValue(id);

Esto supone que el cuadro combinado está configurado para usar id como valueField. Su código parece indicar que este es el caso. También necesitaría tener una referencia al valor de identificación en el que desea establecer el valor. La advertencia aquí es que debe asegurarse de que este código solo se ejecute después de cargar el modelo; de lo contrario, el cuadro combinado no tendrá nada que mostrar. Puede asegurarse de esto configurando el cuadro combinado en el método de devolución de llamada de la llamada ajax o en el evento de carga de la tienda.

Revisé la documentación de Ext.js 4.1, y parece que este método todavía está allí. Creo que esto debería hacer el truco.

Editar: claridad

Respondido el 12 de junio de 12 a las 17:06

Gracias por tu respuesta, ha sido muy útil para solucionar mi pequeño problema :) - Enrico Massone

Gracias a la ayuda de Christopher, escribí una versión funcional de mi código, decidí publicarlo aquí, tal vez podría ser útil para alguien...:

buttons: [{
    text: 'Load',
    handler: function(){
        var form = this.up('form').getForm();
        var combobox = form.findField('ref_id_combo');
        formPanel.getForm().load({
            url: <?php echo "'update_loader.php?id=".$_GET['id']."&item=customer',"; ?>
            waitMsg: 'Loading...',
            success: function(form, action) {
                combobox.setValue(<?php echo  get_property_id("ref_id","customer",$_GET['id']);?>);
            }
        });
    }
 }

Respondido el 13 de junio de 12 a las 13:06

Programáticamente con combo.setValue(val) o declarativamente:

{
    xtype: 'combo',
    value: val,
    ...
}

Respondido el 12 de diciembre de 13 a las 11:12

si desea seleccionar el primer valor de una tienda, puede hacer combo.select(combo.getStore().getAt(0)) seleccionará el valor en el índice 0 de la tienda combinada

respondido 13 mar '15, 12:03

Si crea su propia tienda primero, puede usar afterrender: function(combo){}

listeners: {
    afterrender: function (combo) {
        var record = yourStore.getAt(0);
        var abbr= record.get('abbr');
        combo.setValue(abbr);
    }
}

Respondido 17 Jul 16, 12:07

No es la respuesta que estás buscando? Examinar otras preguntas etiquetadas or haz tu propia pregunta.