Html.ActionLink as a button or an image, not a link

Question

In the latest (RC1) release of ASP.NET MVC, how do I get Html.ActionLink to render as a button or an image instead of as a link?

Answer 1

You can't use Html.ActionLink directly. You should use Url.RouteUrl and use the URL to construct the element you want.

Answer 2

Do what Mehrdad says - or use the url helper from an HtmlHelper extension method like Stephen Walther describes here and make your own extension method which can be used to render all of your links.

Then it will be easy to render all links as buttons/anchors or whichever you prefer - and, most importantly, you can change your mind later when you find out that you actually prefer some other way of making your links.

Answer 3

Late response but you could just keep it simple and apply a CSS class to the htmlAttributes object.

<%= Html.ActionLink("Button Name", "Index", null, new { @class="classname" }) %>

and then create a class in your stylesheet

a.classname
{
    background: url(../Images/image.gif) no-repeat top left;
}

Works for me

Answer 4

Even later response, but I just ran into a similar issue and ended up writing my own Image link HtmlHelper extension.

You can find an implementation of it on my blog in the link above.

Just added in case someone is hunting down an implementation.

Answer 5

I like to use Url.Action() and Url.Content() like this:

<a href='<%: Url.Action("MyAction", "MyController") %>'>
    <img src='<%: Url.Content("~/Content/Images/MyLinkImage.png") %>' />
</a>

Strictly speaking, the Url.Content is only needed for pathing is not really part of the answer to your question.