Графический эквивалент ActionLink в ASP.NET MVC
-
03-07-2019 - |
Вопрос
В ASP.NET MVC есть ли эквивалент Html.Помощник ActionLink для тегов Img?
У меня есть действие контроллера, которое выводит динамически сгенерированный JPEG, и я хотел использовать те же лямбда-выражения для ссылки на него, что и HREFs с помощью ActionLink.
В качестве альтернативы, также был бы приемлем помощник, который просто выдает URL-адрес маршрута (опять же указанный с использованием лямбд).
Редактировать:Изначально я указал, что использую Preview 5, однако я вижу, что выпущена бета-версия.Таким образом, в целом номер версии был ненужной информацией, поскольку я, возможно, скоро обновлюсь :-)
Решение
Url.Action() предоставит вам чистый URL-адрес для большинства перегрузок Html.ActionLink, но я думаю, что функциональность URL-from-lambda доступна только через Html.ActionLink пока что.Надеюсь, в какой-то момент они добавят аналогичную перегрузку к Url.Action.
Другие советы
Вы можете использовать URL-адрес.Метод действия
<a href="<%= Url.Action("Create") %>"><img src="../../Content/Images/add_48.png" /></a>
Этот вопрос старше, и я только недавно начал работать с ASP.NET MVC, когда RC уже вышел, но для тех, кто найдет этот вопрос позже, как и я, это может быть интересно:
По крайней мере, в RC вы можете использовать Url.Action() также с анонимными типами, я думаю, результат выглядит намного приятнее, чем приведенные выше предложения:
<a href="<%= Url.RouteUrl("MyRoute", new { param1 = "bla", param2 = 5 }) %>">
put in <span>whatever</span> you want, also <img src="a.gif" alt="images" />.
</a>
Конечно, для RouteUrl существует множество других перегрузок.
Я использовал обходной путь, чтобы поместить маркер вместо текста для ActionLink, а затем заменить его своим кодом изображения.Что - то вроде этого:
<%= Html.ActionLink("__IMAGE_PLACEHOLDER__", "Products").Replace("__IMAGE_PLACEHOLDER__", "<img src=\"" + myImgUrl + "\" />")%>
Не самое элегантное решение, но оно работает.
В MVC3 ваша ссылка выглядела бы следующим образом:
<a href="@Url.Action("Create")"><img src="../../Content/Images/add_48.png" /></a>
В ASP.NET Бета-версии MVC вы можете использовать Html.BuildUrlFromЭкспрессия способ фьючерсного ассамблеи (которая не входит в ASP.NET MVC по умолчанию в установке, но доступно из CodePlex ( Кодовый комплекс )) чтобы создать ссылку вокруг изображения - или любого HTML-кода - используя синтаксис ActionLink в стиле lambda, например:
<a href="<%=Html.BuildUrlFromExpression<MyController>(c => c.MyAction())%>">
<%=Html.Image("~/Content/MyImage.gif")%>
</a>
Чтобы ссылки на изображения не имели границ, вам нужно будет добавить правило CSS, подобное этому:
img
{
border: none;
}
Вы можете использовать этот элемент управления.Он ведет себя как ActionLink.
http://agilefutures.com/index.php/2009/06/actionimage-aspnet-mvc
Этого довольно просто достичь в MVC 2.Я создал свой собственный очень простой метод расширения для поддержки лямбда-выражений для помощника Url.Action.Для этого требуется, чтобы вы ссылались на фьючерсы MVC 2.
Вот код:
using System;
using System.Linq.Expressions;
using System.Web.Mvc;
using System.Web.Routing;
using ExpressionHelperInternal=Microsoft.Web.Mvc.Internal.ExpressionHelper;
namespace Bnv.Bssi.Web.Infrastructure.Helpers
{
public static class UrlExtensions
{
public static string Action<TController>(this UrlHelper helper, Expression<Action<TController>> action) where TController : Controller
{
RouteValueDictionary routeValuesFromExpression = ExpressionHelperInternal.GetRouteValuesFromExpression<TController>(action);
return helper.Action(routeValuesFromExpression["action"].ToString(), routeValuesFromExpression);
}
}
}
Вот как вы это используете:
<img src="<%= Url.Action<YourController>(c => c.YourActionMethod(param1, param2)); %>" />
Я знаю, что мой пост запоздал, но я хочу поделиться :)
Я добавил новый метод расширения примерно так :
public static class ImageExtensions
{
public static MvcHtmlString ImageLink(this HtmlHelper htmlHelper, string imgSrc, string additionalText = null, string actionName = null, string controllerName = null, object routeValues = null, object linkHtmlAttributes = null, object imgHtmlAttributes = null)
{
var urlHelper = ((Controller)htmlHelper.ViewContext.Controller).Url;
var url = "#";
if (!string.IsNullOrEmpty(actionName))
url = urlHelper.Action(actionName, controllerName, routeValues);
var imglink = new TagBuilder("a");
imglink.MergeAttribute("href", url);
imglink.InnerHtml = htmlHelper.Image(imgSrc, imgHtmlAttributes) + " " + additionalText;
linkHtmlAttributes = new RouteValueDictionary(linkHtmlAttributes);
imglink.MergeAttributes((IDictionary<string, object>)linkHtmlAttributes, true);
return MvcHtmlString.Create(imglink.ToString());
}
public static MvcHtmlString Image(this HtmlHelper htmlHelper, string imgSrc, object imgHtmlAttributes = null)
{
var imgTag = new TagBuilder("img");
imgTag.MergeAttribute("src", imgSrc);
if (imgHtmlAttributes != null)
{
imgHtmlAttributes = new RouteValueDictionary(imgHtmlAttributes);
imgTag.MergeAttributes((IDictionary<string, object>)imgHtmlAttributes, true);
}
return MvcHtmlString.Create(imgTag.ToString());
}
}
Надеюсь, это помогло.
Является ли Url.Content() тем, что вы ищете?
Дайте ему что-то вроде Url.Content("~/path/to/something.jpg"), это превратит его в соответствующий путь на основе корневого каталога приложения.
-Джош
Я взял приведенные выше ответы и сделал что-то вроде расширения-оболочки:
public static MvcHtmlString ActionImageLink(this HtmlHelper helper, string src, string altText, UrlHelper url, string actionName, string controllerName)
{
return ActionImageLink(helper, src, altText, url, actionName, controllerName, null, null);
}
public static MvcHtmlString ActionImageLink(this HtmlHelper helper, string src, string altText, UrlHelper url, string actionName, string controllerName, Dictionary<string, string> linkAttributes, Dictionary<string, string> imageAttributes)
{
return ActionImageLink(helper, src, altText, url, actionName, controllerName, null, linkAttributes, imageAttributes);
}
public static MvcHtmlString ActionImageLink(this HtmlHelper helper, string src, string altText, UrlHelper url, string actionName, string controllerName, dynamic routeValues, Dictionary<string, string> linkAttributes, Dictionary<string, string> imageAttributes)
{
var linkBuilder = new TagBuilder("a");
linkBuilder.MergeAttribute("href", routeValues == null ? url.Action(actionName, controllerName) : url.Action(actionName, controllerName, routeValues));
var imageBuilder = new TagBuilder("img");
imageBuilder.MergeAttribute("src", url.Content(src));
imageBuilder.MergeAttribute("alt", altText);
if (linkAttributes != null)
{
foreach (KeyValuePair<string, string> attribute in linkAttributes)
{
if (!string.IsNullOrWhiteSpace(attribute.Key) && !string.IsNullOrWhiteSpace(attribute.Value))
{
linkBuilder.MergeAttribute(attribute.Key, attribute.Value);
}
}
}
if (imageAttributes != null)
{
foreach (KeyValuePair<string, string> attribute in imageAttributes)
{
if (!string.IsNullOrWhiteSpace(attribute.Key) && !string.IsNullOrWhiteSpace(attribute.Value))
{
imageBuilder.MergeAttribute(attribute.Key, attribute.Value);
}
}
}
linkBuilder.InnerHtml = MvcHtmlString.Create(imageBuilder.ToString(TagRenderMode.SelfClosing)).ToString();
return MvcHtmlString.Create(linkBuilder.ToString());
}
в любом случае, мне стало легче, надеюсь, это поможет кому-то еще.
Я попытался вывести выходные данные из HTML.Изображение в мой HTML.Ссылка на изображение помощник.
@(new HtmlString(Html.ActionLink(Html.Image("image.gif").ToString(), "myAction", "MyController").ToString().Replace("<", "<").Replace(">", ">")))
Проблема для меня в том, что имя ActionLink закодировано так, что у меня есть < вместо <.
Я просто удалил эту кодировку, и результат работает на меня.(Есть ли лучший способ сделать это вместо использования replace?)
Добавление к другим постам:в моем случае (asp.net mvc 3) Я хотел, чтобы ссылка на изображение действовала как средство выбора языка, поэтому в итоге я получил:
public static MvcHtmlString ImageLink(this HtmlHelper htmlHelper, string imgSrc, string cultureName, object htmlAttributes, object imgHtmlAttributes, string languageRouteName = "lang", bool strictSelected = false)
{
UrlHelper urlHelper = ((Controller)htmlHelper.ViewContext.Controller).Url;
TagBuilder imgTag = new TagBuilder("img");
imgTag.MergeAttribute("src", imgSrc);
imgTag.MergeAttributes((IDictionary<string, string>)imgHtmlAttributes, true);
var language = htmlHelper.LanguageUrl(cultureName, languageRouteName, strictSelected);
string url = language.Url;
TagBuilder imglink = new TagBuilder("a");
imglink.MergeAttribute("href", url);
imglink.InnerHtml = imgTag.ToString();
imglink.MergeAttributes((IDictionary<string, string>)htmlAttributes, true);
//if the current page already contains the language parameter make sure the corresponding html element is marked
string currentLanguage = htmlHelper.ViewContext.RouteData.GetRequiredString("lang");
if (cultureName.Equals(currentLanguage, StringComparison.InvariantCultureIgnoreCase))
{
imglink.AddCssClass("selectedLanguage");
}
return new MvcHtmlString(imglink.ToString());
}
Поддержка интернализации была осуществлена с помощью языкового маршрута - оригинальный источник здесь.
Хорошие решения здесь, но что, если вы хотите иметь больше, чем просто изображение в actionlink?Вот как я это делаю:
@using (Html.BeginForm("Action", "Controler", ajaxOptions))
{
<button type="submit">
<img src="image.png" />
</button>
}
Недостатком является то, что мне все еще нужно немного доработать элемент button, но вы можете поместить туда весь html, который хотите.
И это также работает с помощником Ajax: https://stackoverflow.com/a/19302438/961139