Note that there are some explanatory texts on larger screens.

plurals
  1. PO
    primarykey
    data
    text
    <p>I've run into this problem a couple times. The only way I've actually gotten this resolved was to call <code>setValue</code> on the combobox after the store has loaded, you could just add a listener on the store, but that always seemed somewhat messy to me. I usually have a stand-alone event listener like this:</p> <pre><code>Store.on('load',function(store) { Ext.getCmp('order-qty').setValue(store.getAt('0').get('qty')); }); </code></pre> <p><strong>EDIT:</strong> 18 Jan 2012</p> <p>OK as mentioned here is a complete working example of ComboBox with a default value being set. This is done using ExtJS 4.02, should work fine with 4.07 though, not sure about 4.1.</p> <p>Make sure you put your correct extjs path in the links (see brackets at the top of html), otherwise just put both combo-example and data.json at the same directory level and they should run fine:</p> <p>data.json:</p> <pre><code>[ {"value":1,"name":"Option 1"}, {"value":2,"name":"Option 2"}, {"value":3,"name":"Option 3"} ] </code></pre> <p>combo-example.html:</p> <pre><code>&lt;html&gt; &lt;head&gt; &lt;meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"&gt; &lt;title&gt;Combo Box Example&lt;/title&gt; &lt;link rel="stylesheet" type="text/css" href="[your extjs path]/resources/css/ext-all.css"&gt; &lt;script type="text/javascript" src="[your extjs path]/ext-all.js"&gt;&lt;/script&gt; &lt;script type="text/javascript" &gt; 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')); }); }); &lt;/script&gt; &lt;/head&gt; &lt;body&gt; &lt;/body&gt; &lt;/html&gt; </code></pre>
    singulars
    1. This table or related slice is empty.
    plurals
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. VO
      singulars
      1. This table or related slice is empty.
    2. VO
      singulars
      1. This table or related slice is empty.
    3. VO
      singulars
      1. This table or related slice is empty.
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload