documentcloud/backbone — Issue #665: BackBone PushState bug on Back and Next buttons
Author: Atinux
Created: 2011-10-11 10:45:55+00:00
State: open

## Foreword

I'm using Backbone.js **v0.5.3** with PushState like this : Backbone.history.start({ pushState: true });

I create some routes in HTML :

<a href="/">Route Root</a>
<a href="/nodejs">Route Node JS</a>
<a href="/coffeescript">Route Coffee Script</a>

I catch them with jQuery and call app.navigate() :

$('a').click(function (e) {
e.preventDefault();
var href = $(this).attr('href');
app.navigate(href, true);
});

This code works well and each route is caught and changes the content of a div.
An example is available here : http://fianic.com:7000/

## The Bug

The problem came when **pushState** is used and when we use the **Back** and **Next** buttons of the browser.

**An example :**

1. I click on "Route Node JS"
* "Node JS" is displayed on the <div>
2. I click on "Route Coffee Script"
* "Coffee Script" is displayed
3. I press the Back button on my browser
* "Root" is displayed **but my url is /coffeescript**

The problem is present just for **pushState**, with **hashchange** there is no problem.
You can try the same example with **hashchange** here : http://fianic.com:7000/no-push/

## The solution

I just found the solution when I was writting this issue.
The solution is to remove the first **/** of **each link and each route** in BackBone.
**So ...**

<a href="/">Route Root</a>
<a href="/nodejs">Route Node JS</a>
<a href="/coffeescript">Route Coffee Script</a>

**become**

<a href="">Route Root</a>
<a href="nodejs">Route Node JS</a>
<a href="coffeescript">Route Coffee Script</a>

You can close this issue, and maybe it can be the solution for the future developers who have the same "bug".