Backbone Route is not called

Question

I have a working app using Backbone 0.5.3, which is no longer working using backbone 0.9.2.

I identified that Router.navigate() doesn't call my route for some reason.

Here's my Router:

var Router = Backbone.Router.extend({
    routes: {
      '/mypage': 'mypage', 
    },

    mypage: function() { 
      // show page ...
   }
});

Calling the route manually like so works fine:

Router.mypage()

I also tried to overwrite backbone's .navigate method to debug my app ...

var Router = Backbone.Router.extend({
    routes: {
      '/mypage': 'mypage', 
    },

    navigate: function(fragment, options) {
      console.log("navigate called");
      Backbone.history.navigate(fragment, options);
    },

    mypage: function() { 
      // show page ...
   }
});

... it seems that .navigate is called but ...

Backbone.history.navigate(fragment, options);

... just doesn't call the route.

I'm using PushState, here's my initial call:

Backbone.history.start({ 
  root: '/',
  pushState: true,
  silent: true
});

Already tried it without the root and silent parameters - no success.

Again: This works using Backbone 0.5.3.

Thanks to everyone leaving a reply!

Achim

score 3 · Answer 1 · answered Aug 22 '12 at 17:54

3

You have to set the trigger option for the navigate method, e.g:

Router.navigate("/mypath", {trigger: true})

answered Aug 22 '12 at 17:54

Erez Rabih

15,562
3
47
64

Hi @Erez Rabih, yes, I tried it with true + false. On the console ... `App.Router.navigate;` ... returns the following: `function (fragment, options) { Backbone.history.navigate(fragment, options); }` ... while ... `App.Router.navigate("/mypage", {trigger: false});` ... returns "undefined". – Achim Koellner Aug 23 '12 at 08:49
**This is not about using Backbone in general.** My App works fine using backbone 0.5.3 - there must be some change about url matching in backbone 0.9.2 – Achim Koellner Aug 23 '12 at 09:14

score 2 · Accepted Answer · answered Aug 22 '12 at 17:25

2

From the fine manual:

extend Backbone.Router.extend(properties, [classProperties])

Get started by creating a custom router class. [...] Note that you'll want to avoid using a leading slash in your route definitions:

I'm guessing that you simply need to remove the leading slashes from your routes, for example:

routes: {
  'mypage': 'mypage', 
},

answered Aug 22 '12 at 17:25

mu is too short

426,620
70
833
800

Hi @mu is too short, thank you, I checked this already. the route isn't found with and without a leading and/or trailing slash. Calling App.Router.mypage() works fine, so it must be something about route matching. – Achim Koellner Aug 23 '12 at 08:58
2

Whoops! You're right, just double-checked my routes and this fixes it! Btw: The new behaviour about leading slashes in routes is mentioned in backbone's changelog for version 0.9 [http://backbonejs.org/#changelog](http://backbonejs.org/#changelog) – Achim Koellner Aug 23 '12 at 13:00
@Achim: Thanks for checking the changelog. – mu is too short Aug 23 '12 at 18:13

score 0 · Answer 3 · answered Aug 22 '12 at 09:13

0

You must create instance of Router.

var router = new Router();
router.navigate(...);

answered Aug 22 '12 at 09:13

SoWa

314
4
12

Hi SoWA, This is not the complete script, of course I instanciate the Router with `App.Router = new Router;` Having skipped this, the example wouldn't have worked in Backbone 0.5.3 either. – Achim Koellner Aug 22 '12 at 10:32

Backbone Route is not called

3 Answers3