Snippet to show saving tab panel state into a cookie, and then loading it back again. This uses the Sencha ExtJS library.
Ext.application({ launch: function() { Ext.state.Manager.setProvider(new Ext.state.CookieProvider({ expires: new Date(new Date().getTime() + (1000 * 60 * 60 * 24 * 7)) })); Ext.create('Ext.container.Viewport', { layout: 'absolute', items: [{ x: 50, y: 50, width: 300, height: 300, xtype: 'tabpanel', stateful: true, stateId: 'tp1', stateEvents: ['tabchange'], getState: function() { return { activeTab: this.items.findIndex('id',this.getActiveTab().id) }; }, applyState: function(s) { this.setActiveTab(s.activeTab); }, items: [{ id: 'c0', title: 'Tab One' }, { id: 'c1', title: 'Tab Two' }, { id: 'c2', title: 'Tab Three' }] }] }); } });
Hi,
You sample did not work for me because of this: activeTab: this.items.indexOf(this.getActiveTab()). I’m not 100% percent sure why, but what it does it searchs index of you entire object in the items collection of you container.
Instead I used this: activeTab:this.items.findIndex(‘id’,this.getActiveTab().id), searching for the id.
I use ExtJS 4.1.1a
Thanks! I’ll make that change in the example.