Question

I’m just starting to play with Backbone JS as we are starting a very JS intensive application and I want to follow a convention to keep the project from looking horrific in later months and years.

This is probably a simple question but I can’t figure it out.

I have the normal RESTful actions/views etc. and have added another call info just to play with. This renders the index page correctly when the respective link is clicked.

:javascript
  $(document).ready(function() {
  $("#client-clicker").click( function() {
    window.router = new Pm.Routers.ClientsRouter({clients: #{@clients.to_json.html_safe}});
    Backbone.history.start();
  });     
});

Now for the questions:

How does this know to go to the index action of the ClientsRouter?

How do I specify the edit, show or info actions?

Thanks in advance!

I have never used a "convention" for js but backbone js just makes sense!

Update

I did find that if I delete this line in the Clients Router, the default to index breaks.

  routes:
"/new"      : "newClient"
"/index"    : "index"
"/:id/edit" : "edit"
"/:id"      : "show"
".*"        : "index" <----- #deleted and it broke
"/info"     : "info"

I’m still not sure how to hit a specific view.

Answer 1

When you call Backbone.history.start Backbone starts watching for changes to the location, either using pushstate or hashchange events or in older browsers polling the location. It also immediately triggers the route for the current location by comparing window.location.pathname with the route table.

In your case it matches on the “.*” route. I am not sure what the location is at the time this happens but this route will match any location so that’s why it is triggering the index action.

You can change location and optionally trigger an action by calling the navigate method on your router. e.g.

window.router.navigate('/new', true);

should change the location and (because you are passing true in the second parameter) trigger the newClient action.