Results 1 to 8 of 8

Thread: help with history back and router.draw

  1. #1
    Sencha User ggendre's Avatar
    Join Date
    Feb 2012
    Location
    Lannion, France
    Posts
    24

    Question help with history back and router.draw

    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 :
    Code:
    //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 :
    Code:
    //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

  2. #2
    Sencha Premium User mitchellsimoens's Avatar
    Join Date
    Mar 2007
    Location
    Gainesville, FL
    Posts
    40,379

    Default

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

    Check out my GitHub:
    https://github.com/mitchellsimoens

    Posts are my own, not any current, past or future employer's.

  3. #3
    Sencha User edspencer's Avatar
    Join Date
    Jan 2009
    Location
    Palo Alto, California
    Posts
    1,939

    Default

    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
    Ext JS Senior Software Architect
    Personal Blog: http://edspencer.net
    Twitter: http://twitter.com/edspencer
    Github: http://github.com/edspencer

  4. #4
    Sencha User ggendre's Avatar
    Join Date
    Feb 2012
    Location
    Lannion, France
    Posts
    24

    Default

    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

  5. #5
    Sencha User ggendre's Avatar
    Join Date
    Feb 2012
    Location
    Lannion, France
    Posts
    24

    Thumbs up working like a charm !

    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 :
    Code:
    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 :
    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 !

  6. #6
    Sencha User ggendre's Avatar
    Join Date
    Feb 2012
    Location
    Lannion, France
    Posts
    24

    Default

    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...

  7. #7
    Sencha User aatiis's Avatar
    Join Date
    Nov 2011
    Location
    Bajmok, Serbia
    Posts
    60

    Default

    I prefer to use

    Code:
    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.

  8. #8
    Sencha User
    Join Date
    May 2012
    Location
    bangalore
    Posts
    60

    Default

    Quote Originally Posted by ggendre View Post
    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 :
    Code:
    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 :
    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

Tags for this Thread

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •