Using HtmlActionLink ASP.NET and adding attributes

Question

I'm learning ASP.NET MVC, and I have some problems, I would like to know what's the advantage of using Html.ActionLink() method instead of a normal Anchor tag, I don't see any obvious advantage yet, mostlyu because I have more problems using ASP's built-in method. Something else I would like to know, is how to add various attributes to Html.ActionLink(), I'm using this:

@Html.ActionLink("About", "About", "Home", new{ area="" }, new Dictionary<string, Object>{ { "class", "about-link" }, { "aria-role", "button" }, { "title", "About us..." } })

I found this in StackOverflow, but it just doesn't work, and I've been trying many things, but nothing.

Chris Pratt · Accepted Answer · 2015-08-18 18:11:07Z

3

This is the method signature of most likely interest to you:

public static MvcHtmlString ActionLink(
    this HtmlHelper htmlHelper,
    string linkText,
    string actionName,
    string controllerName,
    object routeValues,
    object htmlAttributes
)

For your instance, that would result in the following code:

@Html.ActionLink("About", "About", "Home", new { area = "" }, new { @class = "about-link", aria_role = "button", title = "About us..." })

A few things to note:

The first anonymous object is for route values, and the second anonymous object is for HTML attributes to apply to the anchor tag.
Since class is reserved keyword, you must prefix it with @ inside anonymous objects. It will still be output as class on the anchor tag.
Similarly, aria-role is invalid C# syntax, so you have to use an underscore instead of a dash: aria_role. The built-in HtmlHelper extensions that accept htmlAttributes process the _ and turn it into a - when rendering the HTML.

Now, in terms of why you want to use this in the first place, @Christos points out correctly that by letting MVC construct the URL, your links continue to work even if your routing changes, while if you hardcoded the URL, it would fail. However, he misses the point that this doesn't require using Html.ActionLink. You can just as easily do something like the following:

<a href="@Url.Action("About", "Home", new { area = "" })" class="about-link" aria-role="button" title="About us...">
    About
</a>

This is especially handy when you need something inside the link other than just straight text, like an icon, perhaps. If you find it easier to work directly with the HTML attributes, then you can do that. There's nothing wrong with this and you don't have to use Html.ActionLink. However, do still use Url.Action or one of its siblings, so that your URLs are constructed dynamically based on your route configuration.

answered Aug 18, 2015 at 18:11

Chris Pratt

240k37 gold badges414 silver badges468 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

Andrés Orozco Over a year ago

Thank you very much Chris, you have been very helpfull, and that @Url.Action solution is really handy. I also have found another way to add multiple attributes to that link using @Html.ActionLink, I just use: htmlAttributes: new{ @class = "algunaClase", title = "Some page...", target = "_blank", aria_role="button" }, but my solutions is only longer cause it adds the "htmlAttribute" parameter.

Chris Pratt Over a year ago

That's fine. C# allows named parameters for cases where you may have a number of optional parameter that you don't need and don't want to just fill in null or similar over and over for each. However, if you're already passing routeValues, the next param is htmlAttributes, anyways, so specifying the param name doesn't do anything really.

Christos · Accepted Answer · 2015-08-18 17:34:39Z

1

The basic advantage of using @Html.ActionLink for creating a link instead of using an anchor element is the fact that the output is derived from the routing configuration. That means if you change something in the routes, automatically this change would be reflected to the links you have created using this helper.

Here you will find a detailed list with all the signatures of this method.

answered Aug 18, 2015 at 17:34

Christos

54.1k9 gold badges82 silver badges114 bronze badges

Collectives™ on Stack Overflow

Using HtmlActionLink ASP.NET and adding attributes

2 Answers 2

2 Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

2 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related