Learn from Saki: Stateful ExtJS TabPanel Example

Description

The example shows how to keep the active tab of Ext.tab.Panel and how to use method getState to add new property to the existing state object. Window is also stateful.

Change the tab, move and resize the window and then reload the page.

Main Features

implements getState and applyState
uses Ext.state.CookieProvider to remember active panel in browser cookies
creates Ext.tab.Panel inside stateful window with standard stateful feature
updates window state with beforestatesave listener to relative position
remembers window height,width and pos with same Ext.state.Manager

Use Cases

Use it anytime when you need save active panel (or some another property) as default value after refreshing page

Example Files (relative to example root)

The example has been initially generated with sencha generate app so the following list contains only added or edited files:

index.html
app.js
app.json

app/Application.js
app/view/DemoTabPanelView.js

Source Code

If you want to see the example code, login or sign-up. Free membership is available.

Follow me:

saki

I'm a well seasoned developer, consultant and educator of web applications based mainly on Sencha libraries, PHP, MySQL and Node.js. Besides (Apple) computers, I love photography and mountain biking.