CODEWITHSUNDEEP
c#asp.netasp.net-mvc
Andrés Orozco
Andrés Orozco

Reputation: 2661

Using HtmlActionLink ASP.NET and adding attributes

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.

Upvotes: 0

Views: 139

Answers (2)

Chris Pratt
Chris Pratt

Reputation: 239210

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:

  1. The first anonymous object is for route values, and the second anonymous object is for HTML attributes to apply to the anchor tag.
  2. Since class is reserved keyword, you must prefix it with @ inside anonymous objects. It will still be output as class on the anchor tag.
  3. 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.

Upvotes: 3

Christos
Christos

Reputation: 53958

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.

Upvotes: 1

Related Questions