2012-01-16 23 views
5

Tengo un cuadro combinado que muestra la cantidad de elementos. En función de la selección de cantidad de artículos, estoy mostrando el valor del precio del artículo. De manera predeterminada, estoy configurando el valor del precio para el primer valor del artículo. Sin embargo, cuando me carga la página, quiero que mi cuadro combinado para mostrarse primero Cant elemento es decir 100.preseleccionando el valor del menú desplegable (cuadro combinado) en extjs?

enter image description here

problema: debe cargar Cantidad: 100 en lugar de cargar en blanco

así que he definido una tienda como

Store = new Ext.data.JsonStore({ 
     storeId: 'Store', 
     root: 'storevalue', 
     autoLoad: false, 
     baseParams: { itemid: '${itemID!""}', 
         adjustPrice: '${adjustPrice}', 
         overrideShowPrice: '${overrideShowPrice}' }, 
     url: 'ListQtyPrice.epm', 
     fields: [ 'qty', 'rawprice', 'displayPrice' ] 
    }); 

cuadro de lista desplegable para mostrar Cantidad

<#if Select> 
     new DBEComboBox({ 
      name: 'orderqty', 
      displayField: 'qty', 
      valueField: 'qty', 
      id: 'order-qty', 
      store: Store, 
      forceSelection: true, 
      mode: 'remote', 
      triggerAction: 'all', 
      allowBlank: true, 
      listWidth: 202, 
      triggerClass: 'orderqty-trigger', 
      width: 200 
      ,defaultValue: 100 
      ,listeners: { 
       // for price adjustments 
      } 
     }); 
     </#if> 


Store.load({ 
      callback: function() { 
      alert("reached"); 
      Ext.getCmp('order-qty').setValue(Store.getAt(0).get('qty')); 
      var oqc = Ext.getCmp('order-qty'); 
      var value = Ext.getCmp('order-qty').getValue(); 
      alert(" hey :" +value); 
      } 
     }); 

Capaz de ver hey: 100 en las declaraciones de alerta

Respuesta

7

Me he encontrado con este problema un par de veces. La única forma en que realmente lo resolví fue llamar al setValue en el cuadro combinado después de que la tienda se haya cargado, solo podría agregar un oyente en la tienda, pero eso siempre me pareció un tanto desordenado. Por lo general tienen un detector de eventos independiente como esto:

Store.on('load',function(store) { 
    Ext.getCmp('order-qty').setValue(store.getAt('0').get('qty')); 
}); 

EDIT: 18 de Ene 2012

OK como se ha mencionado aquí es un ejemplo de trabajo completa de ComboBox con que se establece un valor por defecto. Esto se hace usando ExtJS 4.02, debería funcionar bien con 4.07, no estoy seguro acerca de 4.1.

Asegúrese de poner la ruta de extjs correcto en los enlaces (véase soportes en la parte superior de html), de lo contrario sólo hay que poner tanto combo-ejemplo y data.json al mismo nivel de directorio y deben funcionar bien:

data.json:

[ 
    {"value":1,"name":"Option 1"}, 
    {"value":2,"name":"Option 2"}, 
    {"value":3,"name":"Option 3"} 
] 

combo-example.html:

<html> 
    <head> 
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">  
     <title>Combo Box Example</title> 
    <link rel="stylesheet" type="text/css" href="[your extjs path]/resources/css/ext-all.css"> 

    <script type="text/javascript" src="[your extjs path]/ext-all.js"></script> 
    <script type="text/javascript" > 

    Ext.onReady(function() { 

     // the datastore 
     var myStore = new Ext.data.Store({ 
      fields: ['value', 'name'], 
      proxy: { 
       type: 'ajax', 
       url : 'data.json', 
       reader: { 
        type: 'json' 
       } 
      }, 
      autoLoad: true 
     }); 

     // a window to hold the combobox inside of a form 
     myWindow = Ext.create('Ext.Window', { 
      title: 'A Simple Window', 
      width: 300, 
      constrain: true, 
      modal: true, 
      layout: 'fit', 
      items: [{ 
       // the form to hold the combobox 
       xtype: 'form', 
       border: false, 
       fieldDefaults: { 
        labelWidth: 75 
       }, 
       bodyPadding: '15 10 10 10', 
       items: [{ 
        // the combobox 
        xtype: 'combo', 
        id: 'myCombo', 
        fieldLabel: 'A Label', 
        valueField: 'value', 
        displayField: 'name', 
        store: myStore, 
        //queryMode: 'local', 
        typeAhead: true, 
        forceSelection: true, 
        allowBlank: false, 
        anchor: '100%' 
       },{ 
        // shows the selected value when pressed 
        xtype: 'button', 
        margin: '10 0 0 100', 
        text: 'OK', 
        handler: function() { 
         alert('Name: ' + Ext.getCmp('myCombo').getRawValue() + 
           '\nValue: ' + Ext.getCmp('myCombo').value); 
        } 
       }] 
      }] 
     }); 
     // show the window 
     myWindow.show(); 

     // function to give the combobox a default value 
     myStore.on('load',function(store) { 
      Ext.getCmp('myCombo').setValue(store.getAt('0').get('value')); 
     }); 

    }); 

    </script> 

    </head> 
    <body> 
    </body> 
</html> 
+0

I se va a publicar una solución a lo largo de las mismas líneas (+1). Mad-D, debes asegurarte de que el fragmento de Geronimo sea ANTES de llamar a la tienda. Si todavía no funciona, ¿hay algún error en Firebug? ¿Puedes verificar que la tienda, una vez cargada, tenga registros? –

+0

Esto siempre funciona bien para mí ... ¿Esto es para ExtJS ** 4 **? ¿Tu tienda y tu combobox todavía están configurados del mismo modo que el anterior? ¿Puso el ejemplo anterior fuera de todas las demás funciones pero dentro de Ext.onReady? Si quieres ser muy simple al respecto (pero no dinámico), siempre puedes agregar una configuración 'value' al cuadro combinado, por ejemplo:' value: '100'' o 'value: 100' – Geronimo

+0

intenté estas cosas 1 . 'store.getAt (' 0 '). get (' qty '))' en alerta y obtuvo el valor esperado, es decir, 100, pero no estableció defaultvalue. 2. cuando probé el valor: '100' y el valor: 100 no muestra el valor predeterminado establecido como 100. –

Cuestiones relacionadas