Backbone router strange behaviour

Question

I have defined backbone router:

MyApp.router = new (Backbone.Marionette.Router.extend({
  routes: {
    "/m/:id": "openMovie",
    "m/:id": "openMovie"
  },

  openMovie: function(id) {...}
});

My html has link like /m/123. When I click this link backbone doesn't trigger openMovie function - browser opens new page. Why doesn't backbone use history api in this case? How can I fix it with backbone or marionette?

score 2 · Answer 1 · answered Feb 08 '13 at 13:43

2

Backbone pushState support is opt-in. When you've initialized all your routers, call

 Backbone.history.start({pushState: true})

The default behavior is to listen to hashchange events using url #fragments, so if you don't want to use pushState, define you links with a hash url:

<a href="#/m/123"></a>

answered Feb 08 '13 at 13:43

jevakallio

35,324
3
105
112

Yes, I'm using `pushState: true`. When I click link the whole page is refreshed... I need only 'openMovie' to be triggered – fedor.belov Feb 11 '13 at 08:07
@fedor.belov, quirky. Sorry to say, then I don't know what could be the problem. Are you initializing your router before calling `Backbone.history.start`? – jevakallio Feb 11 '13 at 08:12

score 1 · Answer 2 · answered Feb 09 '13 at 11:21

and if you want the compatible version:

if (!Backbone.History.started) {

       // Enable pushState for compatible browsers
       var enablePushState = true;  

       // Disable for older browsers
       var pushState = !!(enablePushState && window.history && window.history.pushState);

       Backbone.history.start({ pushState: pushState });
     }


>

Backbone router strange behaviour

2 Answers2