Backbone Router Not Working On Page Load

I have a backbone application which works great, except for the routing on page load. I need to use the router to instantiate the correct view on page load, but for some reason the

Solution 1:

OK, so to answer my own question I was going about this the wrong way, I was using the following route to match all pages and try and make one solution for all:

':page': 'pageAction',

The problem with this being one solution for all pages was knowing which view to instantiate on page load.

Considering this is a small site which wont have a large amount of changing content or new URLs it makes sense to route the individual URLs like so:

'our-approach.html': 'instantiateOurApproach',
'our-work.html': 'instantiateOurWork',
'who-we-are.html': 'instantiateWhoWeAre',
'social-stream.html': 'instantiateSocialStream',
'contact.html': 'instantiateContact'

Now this means I know exactly which view to instantiate and when.

The other functionality which was inside the pageAction function should have been dependent on click event not the routing.

In the end it appears I was trying to do too much with the router and the better option is to only use the router to instantiate views and to let everything else run off click events.

So that's my solution, please comment with any options on if this is right or wrong.

Solution 2:

You haven't define the pageAction function in your router :

varRouter = Backbone.Router.extend({
    routes: {
        'our-approach.html': 'instantiateOurApproach',
        'our-work.html': 'instantiateOurWork',
        'who-we-are.html': 'instantiateWhoWeAre',
        'social-stream.html': 'instantiateSocialStream',
        'contact.html': 'instantiateContact',
        ':page': 'pageAction'// Igonre this route - this fires successfully after an AJAX call
    },

    pageAction: function() { // the missing function
        ...
    }