Пропадает часть роутера
 

Добрый день!
Есть роутер:

routes: {
   "": "main",       
   "!/order": "order",
   "!/order/(:id)": "order"
},

С ним все ок, и он работает. Но когда перехожу по адресу:
http://site.ru/#!/order/21 , то число 21 "съедается". При этом id я получаю и все ок. Но после перезагрузки страницы, т.к. число 21 "съелось", то id не передается. Как сделать так, что бы (:id) всегда присутствовал в адресе и не пропадал?

Вот тут сделал пример работы: https://jsfiddle.net/alego/ohayr3aa/
Если нажать на "Order 1", а потом на "refresh page", то текущий ID не будет выводится в зоне Content.

jenya,
не совсем в тему:
есть мнение, что делать контроллер из роутера не стоит, у него другие задачи

Спасибо за ответ, но я не совсем понял о чем речь.
Разобрался более детально, проблема в навигации.
К примеру, если есть кнопка вида:

<a href="site.com/#!/page/3">my link</a>

То переход по ней корректный и ведет на адрес - site.com/#!/page/3
Но если ссылку делаем вот такой:

<a href="javascript:void(0);" onclick="Backbone.history.navigate('!/page/3', {trigger:true});">my link</a>

То переход по ней ведет на site.com/#!/page , а не на site.com/#!/page/3 Хотя при первом обращении id сохраняется. Но вот после перезагузки пропадает.
Что не так в конструкции:

Backbone.history.navigate('!/page/3', {trigger:true});

И как сделать, что навигация так же учитывала параметр ID?

jenya,
Вот пример внизу с show/:id http://codebeerstartups.com/2013/01/...g-backbone-js/.