View Full Version : A good back button example?

16 May 2012, 1:51 PM
I am trying to manage the creation and removal of cards in my Ext.Container, and it requires me to create a back button.

I'm a little lost, though, because I can't find a good example of using a back button that listens to an event (or however you would do it).

Basically, I have a list of blogs, and when someone clicks on the list, my controller creates a new panel with the blog details. When the user clicks a back button, I'd like to destroy the panel, because they may click on many more, and I don't want the app to get slow...

Can someone please help me out?

18 May 2012, 5:11 AM
when you click the back button,you want to destroy the panel and back to the list? it means every time you click it ,a new panel will be created?

18 May 2012, 3:04 PM
I think that's a good way to do it, correct? If someone looks at 50 blogs or something, I wouldn't want to have 50 separate panels...

Also, each panel has sub components like a map, etc...which seems a little heavy, and I wouldn't want that stuff loaded when it's not being used, right?

Those are actually real questions I have :)

20 May 2012, 4:55 PM
Sencha created a nice optimization video a while back. The essential points still apply: minimize the DOM. Yes, this means creating and destroying JavaScript-created objects but that is much cheaper than, as you have identified, accumulating a large and bloated DOM with most items hidden except for the relevant panel.

On a tangential note, getting the back button (not just an application back button, but the real browser back button - a physical component on Android devices) requires that your construct your application using routes. This is much harder to do once the application is developed (as Ed noted in a previous post) but it is well worth the effort for seamless back-button behavior.


21 May 2012, 7:35 AM

Thanks ill try and find that video!

27 Jul 2012, 9:41 AM
I would like to continue the initial thread John posted.

Sencha Touch has default back support using routes and history. But it seems like that is available only for the hosted browser based applications and not for PhoneGap like native applications. What is the best practice to achieve this using PhoneGap?

I have a list screen and on selection of any record it shows a detail screen with a back button. When the user taps the back button it should take me back to list screen and the flow should continue.

I tried the below code to go back on tap of back button,
xtype: "myPreviousView"

This code is taking me back to the previous list screen. But when I select any other items in the list screen again, the complete screen blanks out. I guess this could be because the previous view is not set properly. but not sure on how to do that. (or any other better way)

Thanks in advance