Sammy.js 404 on root path

Question

I'm trying to define some routes with sammy.js here is my code:

$.sammy("#main_content", function()
{
    this.get("#!/about", function()
    {
        // Code
    });

    this.get("#!/", function()
    {
        // Code
    });
}).run();

If I goto www.mywebsite.com I always get a 404 error. I've tried putting a blank route in like this.get("", function() {}); and that seems to work for preventing the 404 error but then none of my normal links on the page work. How do I go about fixing this?

Answer 1

To handle the initial request that doesn't contain a hash, use the empty route you mentioned at the bottom of your list of routes

/* Get Home view for empty hash URLs
*/
this.get("", function () {
    this.app.runRoute("get", "#Home");
});

In order for normal links on your site to work, i.e. links to binary files that AJAX requests don't handle, set up your anchor elements with a hash route and parameters as follows (code uses Razor syntax)

<a href="@Url.Content("#Reporting/Excel/" + 
Model.Report.Type.ToString() + "/" +
Model.Report.Audience.ToString() + "/" +
Model.Report.UnitID.ToString() + "/" +
Model.Report.DepartmentID.ToString())">Download Excel version</a>

Now create a route for Sammy to send to the actual URL

/* Reporting Excel requests
*/
this.get("#Reporting/Excel/:type/:audience/:unitID/:departmentID", function () {
   location.assign("Report/Excel?" +
       "Type=" + this.params.type + "&" +
       "Audience=" + this.params.audience + "&" +
       "UnitID=" + this.params.unitID + "&" +
       "DepartmentID=" + this.params.departmentID
   );
});

Answer 2

Just override not found:

this.notFound = function(){ // do something }

You can see it here:https://github.com/quirkey/sammy/issues/67