[solved] Trouble restoring state on a ComboBox

[illuminum]

How do I restore the state on a ComboBox? I've setup the code that is pasted below and I can see in Firebug that the 'statesave' event does indeed fire but 'staterestore' never does. I can also see a cookie stored but all I can inspect as far as that goes is the encoded session id--I'm not sure if I'm supposed to be able to see actual objects and values in the cookie or not. Again, back to the basic question, what exactly do I need to do to restore the state so that upon reloading the application, the application's stateful components conspicuously restore the options/values that were set within them?

Here is my code:

    var combo = new Ext.form.ComboBox({
        id: 'myCombo',
        emptyText: 'Select Foo',
        title: 'Title',
        store: myStore,
        mode: 'remote',
        triggerAction: 'all',
        displayField: 'name',
        valueField: 'rendition_id',
        lazyInit: false,
        stateful: true,
        stateEvents: ['select','change'],
        queryDelay: 1
    });
    combo.on({
       statesave: { // I can see that this fires correctly in firebug
            fn: function() {
                console.log('statesave');
            }
        },
       staterestore: { // Though this never fires
            fn: function() {
                console.log('staterestore');
            }
        }
     });

    <script type="text/javascript">
      Ext.onReady(function() { 
          Ext.BLANK_IMAGE_URL = 'assets/ext/resources/images/default/s.gif';
           Ext.state.Manager.setProvider(new Ext.state.CookieProvider({
              expires: new Date(new Date().getTime()+(1000*60*60*24*1))
          }));
          Ext.QuickTips.init();
          App.init();
      });
    </script>

[illuminum]

One more followup question,

How do I instruct either the store or the combobox to cache it's values so that I can call the load() manually (if thats part of what is needed) with the objective that the combobox does not trigger a post request each time the drop-down is triggered?

[illuminum]

bump--
maybe I'll find the solution myself, I'm about to browse the community learning center--but in the meanwhile... ?

I wonder what my super's reaction would be to a proposal to license extjs. What kind of license should I be looking at for a non-profit educational institution (NCSA at UIUC)? So far it's just me working with ExtJS. Silver ($299/yr) I assume, but do any special provisions apply to an institution like mine? This particular question is probably best posted elsewhere...

[illuminum]

Figured it out

    this.navigation.test = new Ext.form.ComboBox({
        id: 'select_arabic_test',
        emptyText: 'Select: Arabic Font',
        title: 'Arabic Font',
        store: this.navigation.select.arabic.store,
        displayField: 'name',
        valueField: 'rendition_id',
        plugins: [
            new Ext.ux.plugins.FitToContainer({
                width_adjust: -28,
                x_adjust: 6,
                y_adjust: 1,
                hideFirst: true,
                height: false
            })
        ],
        stateful: true,
        stateEvents: ['select'],
        getState: function() {
            return {
                selectedIndex: this.getValue()
            };
        },
        applyState: function(state) {
            this.onLoad = this.onLoad.createSequence(function() {
                this.selectByValue(state.selectedIndex);
            },this);
        },
        mode: 'local',
        triggerAction: 'all',
        lazyInit: false,
        forceSelection: true,
        editable: false
    });

      Ext.onReady(function() { 
        Ext.BLANK_IMAGE_URL = 'assets/ext/resources/images/default/s.gif';
        Ext.state.Manager.setProvider(new Ext.state.CookieProvider({
            expires: new Date(new Date().getTime()+(1000*60*60*24*365)) // 1 year
        }));
        Ext.QuickTips.init();
        Quran.init();
      });

[devtig]

For Ext JS 4:

http://www.sencha.com/forum/showthre...108#post798108

[houxiaofei]

Figured it out

    this.navigation.test = new Ext.form.ComboBox({
        id: 'select_arabic_test',
        emptyText: 'Select: Arabic Font',
        title: 'Arabic Font',
        store: this.navigation.select.arabic.store,
        displayField: 'name',
        valueField: 'rendition_id',
        plugins: [
            new Ext.ux.plugins.FitToContainer({
                width_adjust: -28,
                x_adjust: 6,
                y_adjust: 1,
                hideFirst: true,
                height: false
            })
        ],
        stateful: true,
        stateEvents: ['select'],
        getState: function() {
            return {
                selectedIndex: this.getValue()
            };
        },
        applyState: function(state) {
            this.onLoad = this.onLoad.createSequence(function() {
                this.selectByValue(state.selectedIndex);
            },this);
        },
        mode: 'local',
        triggerAction: 'all',
        lazyInit: false,
        forceSelection: true,
        editable: false
    });

      Ext.onReady(function() { 
        Ext.BLANK_IMAGE_URL = 'assets/ext/resources/images/default/s.gif';
        Ext.state.Manager.setProvider(new Ext.state.CookieProvider({
            expires: new Date(new Date().getTime()+(1000*60*60*24*365)) // 1 year
        }));
        Ext.QuickTips.init();
        Quran.init();
      });

Why I used the same vode here but never get the state saved and the applyState and staterestore never get fired, the following is my sample code, any advice? Thanks!

var combo = new Ext.form.ComboBox({
        id: 'myCombo',
		stateId: 'myCombostate',
        emptyText: 'Select one please',
        title: 'Please select one...',
        store: [['f','Foo'],['b','Bar']],
        displayField: 'name',
        valueField: 'rendition_id',
		plugins: [
            new Ext.ux.plugins.FitToContainer({
                width_adjust: -28,
                x_adjust: 6,
                y_adjust: 1,
                hideFirst: true,
                height: false
            })
        ],
        stateful: true,
        stateEvents: ['select'],
        getState: function() {
            return {
                selectedIndex: this.getValue()
            };
        },
        applyState: function(state) {
            this.onLoad = this.onLoad.createSequence(function() {
                this.selectByValue(state.selectedIndex);
            },this);
        },
		mode: 'local',
        triggerAction: 'all',
		lazyInit: false,
		forceSelection: true,
        editable: false
    });
combo.on({
       statesave: { 
            fn: function() {
                alert('statesave');
            }
        },
       staterestore: { 
            fn: function() {
                alert('staterestore');
            }
        }
     });


Ext.onReady(function() {
Ext.state.Manager.setProvider(new Ext.state.CookieProvider()); 


 var win = new Ext.Window({ 
id:'combo-win' 
,title:'test'
,layout:'fit' 
,width:280 
,height:360 
,closable:false 
,border:false 
,items:combo 
}); 


win.show(); 
Ext.QuickTips.init();


});