Browser History with ExtJS MVC

Question

I am looking for an example of ExtJs MVC which supports browser history. The example they have on the Sencha site here is not MVC based.

The other one I found here uses dynamically loaded views and controller. I imagine the solution is a combination of the 2 approaches. Wondering if anyone has a ready example that I can refer to?

Answer 1

I managed to put together an example by combining the approaches from the 2 links above. Here is the jsfiddle with the ext js script: http://jsfiddle.net/chetanbaheti/zGXr6/3/

There are 2 views (tabs) - home and providers with corresponding history tokens

DemoApp.view.HomeTab
DemoApp.view.ProvidersTab

Each tab is managed by its corresponding controller that's responsible for creating an instance of the view and registering a history token.

DemoApp.controller.HomeController
//and its history token
this.uiToken = 'MainTabPanel,HomeTab';

The job of managing initial ui state is done by the application functions:

initializeHistoryHandling
setUiState

While the job of changing the history token on selecting tabs (by user action) is done by the main view controller:

DemoApp.controller.ViewportController:onTabpanelTabChange

This nicely manages the ui state based on the url and vice versa.