help with history back and router.draw

[ggendre]

Hi,

I am developing an app for ios and android with senchatouch and phonegap.
I need to handle the hardware back button of android phones.

In phonegap i can do :

//Define a handler for the back button
document.addEventListener("backbutton", onBackKeyDown, false);
function onBackKeyDown(e) {
       //get back to the home of my app
        Ext.getCmp('app').setActiveItem('home');
        e.preventDefault()
}

...but there is no Ext.History.back()
Then I found Ext.Router.draw which seems promising...

The biggest documentation I found is :

//Note the # in the url examples below
Ext.Router.draw(function(map) {
    //maps the url http://mydomain.com/#dashboard to the home controller's index action
    map.connect('dashboard', {controller: 'home', action: 'index'});

    //fallback route - would match routes like http://mydomain.com/#users/list to the 'users' controller's
    //'list' action
    map.connect(':controller/:action');
});

But, I have no 'actions' in my main app controller, only 'refs' and 'controls'.
How do I define actions ?
Is 'action' the id of the view I want to display?
Do someone have a working exemple, or a link to more documentation?

Thanks a lot for any help

[mitchellsimoens]

If you have routes setup and acting appropriately then you could do window.history.back()

[edspencer]

Where are you seeing that Router.draw documentation? That's all deprecated and the 1.x way. I suggest you check out http://docs.sencha.com/touch/2-0/#!/...istory_support for the updated way of doing this

[ggendre]

thank you for the replies and thank you for the link !!

I was only using the pr4-docs which does not contain any documentation about routes. The snippet I pasted first was (yes, sorry) an extract of an old 1.x doc

[ggendre]

For thoses who are a bit lost like I was, here is what I've done :

My app is based around a big navigationView with an id of 'app'.
in my main controller I added two routes :

routes:{
            'showView/:name': 'showView',
            '':'showHome'
        }

And, in my controller fonctions, instead of calling the views changes with app.setActiveItem(myViewNumber), I now use this.redirect('showView/myViewName').
That is doing the url change and call the handlers of my routes.
Now, window.history.back is working !

To handle the back button with phonegap, I know it is a little out of the scope of senchatouch but here is my code :

document.addEventListener("backbutton", onBackKeyDown, false);
function onBackKeyDown(e) {
           if(Ext.getCmp('app').getActiveItem().id!="home"){
            window.history.back();
        }
        else{
            document.removeEventListener("backbutton", onBackKeyDown, false);
        }
}

hope this helps.
and thanks to edspencer and mitchellsmoens for the tips !

[ggendre]

another way of handling the back action, without using history and only in the case of an app based on a navigationView is to do

Ext.getCmp('app').pop()

in the phonegap onBackKeyDown event handler.

don't know what it's best to use yet...

[aatiis]

I prefer to use

Ext.getCmp('app').pop()

, though there's a problem with that: it won't change the location.hash, so your window.history object is not updated, which is usually not the expected/preferred behaviour.

[bluemvj]

For thoses who are a bit lost like I was, here is what I've done :

My app is based around a big navigationView with an id of 'app'.
in my main controller I added two routes :

routes:{
            'showView/:name': 'showView',
            '':'showHome'
        }

And, in my controller fonctions, instead of calling the views changes with app.setActiveItem(myViewNumber), I now use this.redirect('showView/myViewName').
That is doing the url change and call the handlers of my routes.
Now, window.history.back is working !

To handle the back button with phonegap, I know it is a little out of the scope of senchatouch but here is my code :

document.addEventListener("backbutton", onBackKeyDown, false);
function onBackKeyDown(e) {
           if(Ext.getCmp('app').getActiveItem().id!="home"){
            window.history.back();
        }
        else{
            document.removeEventListener("backbutton", onBackKeyDown, false);
        }
}

hope this helps.
and thanks to edspencer and mitchellsmoens for the tips !

Hi thanks for this information, I have some issue i have a global toolbar in a view which has one controller, This toolbar View i am using as xclass in all other views now i have a back button on toolbar so can u please provide any solution for this i tried the above code but back button is not working