ASP.NET MVC `Html.ActionLink` between "Areas"

Question

I have added a new Area to my MVC3 project and I am trying to link from the _Layout page to the new Area. I have added an Area called 'Admin' that has a controller 'Meets'.

I used the visual studio designer to add the area so it has the correct area registration class etc, and the global.asax file is registering all areas.

However, when I use the following 2 action links in a page in the root, I run into a few problems:

@Html.ActionLink("Admin", "Index", "Meets", new { area = "Admin" }, null) @Html.ActionLink("Admin", "Index", "Meets", new { area = "" }, null) 

When clicking both links, I am taken to the Meets controller in the Admin area, where the application then proceeds to throw an error saying it cannot find the Index page (even though the Index page is present in the Views folder in the Area sub-directory.

The href for the 1st link looks like this:

http://localhost/BCC/Meets?area=Admin

And the href for the 2nd link looks like this:

http://localhost/BCC/Meets

Also if I hit the link that I expect to be created:

http://localhost/BCC/Admin/Meets

I just get a resource cannot be found error. All very perplexing! I hope someone can help...

Answer 1

Strange indeed. Steps that worked perfectly fine for me:

1. Create a new ASP.NET MVC 3 application using the default Visual Studio template
2. Add an area called Admin using Visual Studio designer by right clicking on the project

3. Add new Controller in ~/Areas/Admin/Controllers/MeetsController:

   public class MeetsController : Controller {     public ActionResult Index()     {         return View();     } } 

4. Add a corresponding view ~/Areas/Admin/Views/Meets/Index.cshtml

5. In the layout (~/Views/Shared/_Layout.cshtml) add links:

   @Html.ActionLink("Admin", "Index", "Meets", new { area = "Admin" }, null) @Html.ActionLink("Admin", "Index", "Meets", new { area = "" }, null) 

6. Run the application.

Rendered HTML for the anchors:

<a href="/Admin/Meets">Admin</a> <a href="/Meets">Admin</a> 

As expected the first link works whereas the second doesn't.

So what's the difference with your setup?

Answer 2

Another option is to utilize RouteLink() instead of ActionLink(), which bypasses the area registrations altogether:

ActionLink version:

Html.ActionLink("Log Off", "LogOff", "Account", new { area = "" }, null) 

RouteLink version:

Html.RouteLink("Log Off", "Default",      new { action = "LogOff", controller = "Account" }) 

The second parameter is a "Route Name" which is registered in Global.asax.cs and in various 'AreaRegistration' subclasses. To use 'RouteLink' to link between different areas, you only need to specify the correct route name.

This following example shows how I would generate three links to different areas from a shared partial, which works correctly regardless of which area I am 'in' (if any):

@Html.RouteLink("Blog", "Blog_default",      new { action = "Index", controller = "Article" }) <br/> @Html.RouteLink("Downloads", "Download_default",      new { action = "Index", controller = "Download" }) <br/> @Html.RouteLink("About", "Default",      new { action = "Index", controller = "About" }) 

Happy coding!