The MVC framework: working with anchors

Today we’ll keep talking about the MVC framework and we’ll see how easy it is to add anchors to our apps. In the past, we’ve already seen that the framework introduces a class called UrlHelper that you can use in order to get the correct url for a specific action. So, adding an anchor to a view could be done through code like this:

<a href="<%= this.Url.RouteUrl( "Default", new { action = "About" } ) %>" title="Navigate to about page">
        Go to About
</a>

(btw, I’m assuming that you’ve created a new default project and the previous code is reusing the routes introduced by that template).

As you can see, we’re writing the complete html for the anchor and using the helper in order to get the correct url for the href attribute. You can achieve the same result by using the ActionLink or RouteLink extension methods “added” to the HtmlHelper class. Here’s a snippet with both of them in action:

<%= Html.ActionLink( "Go to About", "About" ) %>

<%= Html.RouteLink( "Got  to About", new { action = "About"} ) %>

As you can see, in this case the syntax for RouteLink is not as direct as the one you’ll get with ActionLink. And there’s a reason for that. Generally, you’ll use the ActionLink method when you want to specify an action and controller. On the other hand, if you also want to set the name of the route, then you can use the RouteLink method.

Both methods have several overloads which let you specify:

• the name of the controller;
• the name of the desired action;
• the dictionary with values that should be passed to the route parameters (ie,an element of type RouteValueDictionary with values that are passed to the existing route parameters);
• the HTML attributes that should be applied to the generated anchor;
• the HTML protocol you want to use;
• the hostname (if you want to set it explicitly);
• the fragment used to identify a named anchor (so that you can specify urls a la http://…something#name).

Additionally,the RouteLink method will also let you pass the name of the route (as we’ve seen above). Internally, both methods end up calling the more general GenerateLink method (which is public and static and defined by the HtmlHelper class).

One more note before ending: the more astute readers have already spotted that the 1st example (where we specified the URL through the UrlHelper class) generates slightly different HTML. The difference lays on the HTML title attribute, which isn’t generated when we used the HtmlHelper extension methods. If you need to set that attribute, you’ll have to use one of the overloads that receives the HTML attributes that should be rendered (don’t forget that at least one of the overloads receives an Object parameter, which means that you can use anonymous objects for setting the attributes you need).

And that’s all for today. More about the MVC framework on the next posts.

~ by Luis Abreu on January 29, 2009.