65 votes

Faire un Html.ActionLink autour d'une Image en ASP.NET MVC?

Comment puis-je faire quelque chose de similaire à Html.ActionLink() à l'exception de la place, le lien généré autour d'une Image au lieu de simplement cracher le lien?

135voto

Craig Stuntz Points 95965

Rasoir (Moteur D'Affichage):

<a href="@Url.Action("ActionName", "ControllerName")">
    <img src="@Url.Content("~/Content/img/imgname.jpg")" />
</a>

ASPX (Moteur d'Affichage):

<a href="<%= Url.Action("ActionName", "ControllerName") %>">
    <img src="<%= Url.Content("~/Content/img/imgname.jpg") %>" />
</a>

Évidemment, si vous faites cela, plus d'une fois, écrire à quelqu'un pour elle. Et remplissez les autres attributs de l'img/un. Mais cela devrait vous donner l'idée générale.

22voto

eu-ge-ne Points 17847

Essayez quelque chose comme ceci:

public static string ActionLinkWithImage(this HtmlHelper html, string imgSrc, string actionName)
{
    var urlHelper = new UrlHelper(html.ViewContext.RequestContext);

    string imgUrl = urlHelper.Content(imgSrc);
    TagBuilder imgTagBuilder = new TagBuilder("img");
    imgTagBuilder.MergeAttribute("src", imgUrl);
    string img = imgTagBuilder.ToString(TagRenderMode.SelfClosing);

    string url = UrlHelper.Action(actionName);

    TagBuilder tagBuilder = new TagBuilder("a") {
        InnerHtml = img
    };
    tagBuilder.MergeAttribute("href", url);

    return tagBuilder.ToString(TagRenderMode.Normal);
}

Espérons que cette aide

6voto

Dilip0165 Points 655

La première réponse donnée par @Craig Stuntz est absolument parfait, mais ma préoccupation est de savoir si ce sera à toi de le faire si vous avez Ajax.ActionLink au lieu de Html.ActionLink. Ici, je vais expliquer à des solutions de facilité pour les deux méthodes. Vous pouvez le faire comme suit pour Html.ActonLink:

@Html.Raw(@Html.ActionLink("[replacetext]", "Index", "Home").ToHtmlString().Replace("[replacetext]", "<img src=\"/Contents/img/logo.png\" ... />"))

même concept peut être appliqué pour Ajax.ActionLink

@Html.Raw(@Ajax.ActionLink("[replacetext]", "Index", "Home", new AjaxOptions { UpdateTargetId="dvTest"}).ToHtmlString().Replace("[replacetext]", "<img src=\"/Contents/img/logo.png\" … />"))

donc, ce sera facile pour vous.

2voto

olga Points 11

plus facile...

modifier votre code par:

<p class="site-title">@Html.ActionLink(" ", "Index", "Home",
    new
    {
        style = "background: url('" + Url.Content("~/images/logo.png") + "') no-repeat center right; display:block; height:50px;width:50px;"
    })</p>

0voto

Marko Points 1093

Vous pouvez créer htmlhelper qui renvoie l'image avec le lien... En tant que paramètres, vous passerez à htmlhelper des valeurs telles que le chemin de l'image et de lien et dans htmlhelper vous allez utiliser StringBuilder au format html de l'image liée à l'correctement...

cheers

Prograide.com

Prograide est une communauté de développeurs qui cherche à élargir la connaissance de la programmation au-delà de l'anglais.
Pour cela nous avons les plus grands doutes résolus en français et vous pouvez aussi poser vos propres questions ou résoudre celles des autres.

Powered by:

X