Question

I have a router defined somewhat similar to the following (greatly simplified for demo purposes here):

var MyRouter = Backbone.Router.extend({
    routes: {
        '': 'search',
        'directions': 'directions',
        'map': 'map'
    },
    search: function () {
        // do something
    },
    directions: function () {
        // do something
    },
    map: function () {
        // do something
    },
    initialize: function () {
        this.listenTo(myModel, 'change', this.updateNavigation);
        Backbone.history.start({ pushState:true });
    },
    updateNavigation: function () {
        var selected = myModel.get('selected');
        this.navigate(selected);
    }
});

The history entries are all getting created properly by the updateNavigation call, and when I hit the back-button to go back through the history I've generated, the routes fire for each of the entries, that is until I get to the initial entry. At that point, even though the url has updated with that history entry, the route that should interpret the url at that point does not fire. Any idea what might be going on here? Am I making some bad assumptions about how history works?

EDIT:

It seems I get inconsistent results - it's not always just the initial entry that doesn't execute, it's sometimes anything after the first time I've went back one through history. That is, I click the back-button once, the url changes, the routes fire properly. I hit it again, the url changes, the routes don't fire. It smacks of me doing something wrong, but I haven't a clue.

Was it helpful?

Solution 3

I've discovered the problem. I was using a querystring and updating the querystring based on actions within the application. Each time I modified the querystring, I added another history entry, but the actual route parts of the history entry didn't always change. Backbone won't do do anything different based on the same route but with different querystring, so I had to abandon using the querystring and just make restful urls instead. Once I did that, the history worked fine.

OTHER TIPS

Don't ask me why, but my browser back button doesn't seem to function properly when I don't trigger: true on @navigate.

My very brief assumption is that Backbone.history.start({ pushState:true }); used in wrong place.

As far as I know, backbone history start should be after the router instance is created. Like,

var router = new MyRouter();
Backbone.history.start({ pushState:true });
Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top