Home:ALL Converter>Backbone hash based navigation and jqm

Backbone hash based navigation and jqm

Ask Time:2012-09-23T06:44:17         Author:genericatz

Json Formatter

I've got the following routes:

routes: {
        "home": "login",
        "login": "login",
        "forum": "forum",           
        "group/:id/:group": "group",
        "": "login",
}

if i'm on page forum the URL is url.com/#forum, but if I navigate from the forum view to the group view with:

router.navigate("group/:123/:nicegroup", {trigger: true});
  1. problem: then the url changes to "url.com/group/123/nicegroup". In the meantime the "" route will be called because there is no "#" I think and the empty route "" fires. I end up on the login page.

  2. problem: if I delete the "" route, then navigating from #forum to page group with:

    router.navigate("group/:123/:nicegroup", {trigger: true});

the url changes to url.com/group/123/nicegroup without the # in front of group. It works fine, but if I go back pushing the browser's back button, the url changes to url.com/#forum again and nothing happens. I still stay on the group page and I get the error:

Uncaught TypeError: Cannot call method 'indexOf' of undefined jquery.mobile-1.1.0.js:3791
$.extend.resetUIKeys jquery.mobile-1.1.0.js:3791
$.extend.hashValueAfterReset jquery.mobile-1.1.0.js:3803
$.extend.onPopState jquery.mobile-1.1.0.js:3863
jQuery.event.dispatch require-jquery.js:5385
jQuery.event.add.elemData.handle.eventHandle

Again, in the second problem I already deleted the "" route, so that it doesn't bother me but it's still my 1st problem.

I disabled all jqm navigation.

    $.mobile.ajaxEnabled = false;
    $.mobile.linkBindingEnabled = false;
    $.mobile.hashListeningEnabled = false;
    $.mobile.pushStateEnabled = false;

Author:genericatz,eproduced under the CC 4.0 BY-SA copyright license with a link to the original source and this disclaimer.
Link to original article:https://stackoverflow.com/questions/12548284/backbone-hash-based-navigation-and-jqm
yy