Sitecore + Async != Nightmare

This is a sequel to my previous blog post on controller renderings in Sitecore and MVC views (http://blog.olgakogan.net/2016/11/integrating-isolated-mvc-app-with-sitecore.html). My next challenge was to make async calls. The key to this functionality is registering each route involved in async calls separately. Let's look at all the pieces of the puzzle.

In my view I have a label which displays my email. Next to it there's a button that opens up a text box where you can enter a new email.

In my 'Account' controller I have a method called 'UpdateEmail' that is reading a query string parameter called 'email'. This method records the new email in the database.

Upon a click of the Save button a block of javascript code invokes this method asynchronously:

var urlString = "/account/updateemail/?email=" + model.Email;

$.getJSON(urlString, function (data) 
{
      // Do your stuff here such as hide the div 
      // with the text box and Save and Cancel buttons.
}

When testing I was getting a 404 error which was not surprising because with Sitecore I need to have a navigable item with a controller rendering on it that points to my account controller and the 'UpdateEmail' method.

I tried registering this route individually and it worked! In the RegisterRoutes class, inside Register method I added the following:

routes.MapRoute("AccountUpdateEmail", "account/updateemail", new {controller = "Account", action = "UpdateEmail"});

I think this is a small price to pay for having a way to do async calls with sitecore: register each route involved in those calls separately.