Backbone Router

by Joshua McNeese

HTML

<script src="https://cdn.jsdelivr.net/g/[email protected],[email protected],[email protected],[email protected]"></script>
<ul>
    <li><a href="#posts">List Posts</a></li>
    <li><a href="#posts/add">Add New Post</a></li>
    <li><a href="#posts/1/edit">Edit Post 1</a></li>
</ul>
<hr>
<div id="content"></div>

JavaScript

var AppRouter = Backbone.Router.extend({
// the internal 'routes' parameter associates any hash keyword to a function
  routes: {
    "posts": "ListPosts",
    "posts/add": "AddPost", 
    "posts/:id/edit": "EditPost"   
  },
  initialize: function() {
    Backbone.history.start();
  },
  ListPosts: function() {
    $('#content').html('ListPosts');
  },
  AddPost: function() {
    $('#content').html('AddPost');
  },
  EditPost: function(id) {
    $('#content').html('EditPost ', id);
  }
});

var appRouter = new AppRouter;
// backbone router class works using history class (http://documentcloud.github.com/backbone/#History) to manage hash change
Backbone.history.start();