I'm currently using backbone boilerplate and running it on my MAMP server localhost. I can't seem to get router to work
require([
// Global
"app",
// Libs
"jquery",
"backbone"
],
function(app, $, Backbone) {
// Defining the application router, you can attach sub routers here.
var Router = Backbone.Router.extend({
routes: {
"photo" : "getPhoto",
"*other" : "index"
},
index: function()
{
console.info('Index Function Working');
},
getPhoto: function()
{
console.log("You are trying to reach photo ");
}
});
// Treat the jQuery ready function as the entry point to the application.
// Inside this function, kick-off all initialization, everything up to this
// point should be definitions.
$(function() {
// Define your master router on the application namespace and trigger all
// navigation from this instance.
app.router = new Router();
console.info('Here');
// Trigger the initial route and enable HTML5 History API support
Backbone.history.start({ pushState: true });
});
// All navigation that is relative should be passed through the navigate
// method, to be processed by the router. If the link has a `data-bypass`
// attribute, bypass the delegation completely.
$(document).on("click", "a:not([data-bypass])", function(evt) {
// Get the anchor href and protocol
var href = $(this).attr("href");
var protocol = this.protocol + "//";
// Ensure the protocol is not part of URL, meaning it's relative.
if (href && href.slice(0, protocol.length) !== protocol &&
href.indexOf("javascript:") !== 0) {
// Stop the default event to ensure the link will not cause a page
// refresh.
evt.preventDefault();
// `Backbone.history.navigate` is sufficient for all Routers and will
// trigger the correct events. The Router's internal `navigate` method
// calls this anyways.
Backbone.history.navigate(href, true);
}
});
});
It just keeps hitting the index function.
I've put this into my url "http://localhost:8888/OutfitApp/#photo*" and "http://localhost:8888/OutfitApp/photo"
Both don't work.
I removed
"*other" : "index"
and nothing comes out into my console.
I'm confused what am I missing??
From the docs:
If your application is not being served from the root url / of your domain, be sure to tell History where the root really is, as an option: Backbone.history.start({pushState: true, root: "/public/search/"})
Could that be the problem?
In your case, try:
Backbone.history.start({pushState: true, root: "/OutfitApp/"})