Как поместить элемент span внутри ActionLink MVC3?
как я могу поместить элемент span внутри ActionLink, но не с URL.Действие?
Это:
<li><span>
@Ajax.ActionLink("LinkText", "ControllerName", new AjaxOptions
{
UpdateTargetId = "div",
InsertionMode = InsertionMode.Replace,
HttpMethod = "GET",
LoadingElementId = "progress"
})
</span></li>
выдает:
<li>
<span>
<a href="/Home/ControllerName" data-ajax-update="#scroll"
data-ajax-mode="replace" data-ajax-method="GET"
data-ajax-loading="#progress" data-ajax="true">LinkText</a>
</span>
</li>
но мне нужно кое-что еще. Как я могу создать пользовательский метод MVC3 ActionLink, который генерирует этот вывод:
<li>
<a href="/Home/ControllerName" data-ajax-update="#scroll"
data-ajax-mode="replace" data-ajax-method="GET"
data-ajax-loading="#progress" data-ajax="true">
<span>LinkText</span> // this span generated inside <a>
</a>
</li>
6 ответов
как поместить элемент span внутри ActionLink, но не с URL.Действие
простой ответ: вы не можете. Метод ActionLink HTML кодирует текст ссылки, и вы мало что можете с этим поделать (вы можете открыть билет в Microsoft, чтобы они предоставили перегрузку, которая позволяет вам сделать это в ASP.NET MVC vNext).
на данный момент Вы можете написать пользовательский помощник html, который не будет кодировать:
public static class AjaxExtensions
{
public static IHtmlString MyActionLink(
this AjaxHelper ajaxHelper,
string linkText,
string actionName,
AjaxOptions ajaxOptions
)
{
var targetUrl = UrlHelper.GenerateUrl(null, actionName, null, null, ajaxHelper.RouteCollection, ajaxHelper.ViewContext.RequestContext, true);
return MvcHtmlString.Create(ajaxHelper.GenerateLink(linkText, targetUrl, ajaxOptions ?? new AjaxOptions(), null));
}
private static string GenerateLink(
this AjaxHelper ajaxHelper,
string linkText,
string targetUrl,
AjaxOptions ajaxOptions,
IDictionary<string, object> htmlAttributes
)
{
var a = new TagBuilder("a")
{
InnerHtml = linkText
};
a.MergeAttributes<string, object>(htmlAttributes);
a.MergeAttribute("href", targetUrl);
a.MergeAttributes<string, object>(ajaxOptions.ToUnobtrusiveHtmlAttributes());
return a.ToString(TagRenderMode.Normal);
}
}
и затем:
@Ajax.MyActionLink(
"<span>LinkText</span>",
"ActionName",
new AjaxOptions {
UpdateTargetId = "div",
InsertionMode = InsertionMode.Replace,
HttpMethod = "GET",
LoadingElementId = "progress"
}
)
Я знаю, что это старый, но я использую этот быстрый и грязный способ для добавления кнопки оформлены ссылки в моих сетях. Вы можете добавить перегрузки, чтобы включить имена маршрутов / etc. также. Надеюсь, это кому-то поможет.
public static MvcHtmlString GridAnchor(this HtmlHelper html, string linkText, string actionName, string controllerName,
object routeValues, object htmlAttributes)
{
var result = new TagBuilder("a");
var url = UrlHelper.GenerateUrl(null, actionName, controllerName, new RouteValueDictionary(routeValues), html.RouteCollection,
html.ViewContext.RequestContext, true);
result.Attributes.Add("href", url);
result.MergeAttributes(new RouteValueDictionary(htmlAttributes));
result.InnerHtml = "<span>" + linkText + "</span>";
return MvcHtmlString.Create(result.ToString());
}
Я изменил ответ Darins немного, чтобы иметь возможность разместить RouteValues.
public static class AjaxExtensions
{
public static IHtmlString MyActionLink(
this AjaxHelper ajaxHelper,
string linkText,
string actionName,
AjaxOptions ajaxOptions
)
{
var targetUrl = UrlHelper.GenerateUrl(null, actionName, null, null, ajaxHelper.RouteCollection, ajaxHelper.ViewContext.RequestContext, true);
return MvcHtmlString.Create(ajaxHelper.GenerateLink(linkText, targetUrl, ajaxOptions ?? new AjaxOptions(), null));
}
public static IHtmlString MyActionLink(
this AjaxHelper ajaxHelper,
string linkText,
string actionName,
object routeValues,
AjaxOptions ajaxOptions
)
{
System.Web.Routing.RouteValueDictionary routeVals = new System.Web.Routing.RouteValueDictionary(routeValues);
var targetUrl = UrlHelper.GenerateUrl(null, actionName, null, routeVals, ajaxHelper.RouteCollection, ajaxHelper.ViewContext.RequestContext, true);
return MvcHtmlString.Create(ajaxHelper.GenerateLink(linkText, targetUrl, ajaxOptions ?? new AjaxOptions(), null));
}
private static string GenerateLink(
this AjaxHelper ajaxHelper,
string linkText,
string targetUrl,
AjaxOptions ajaxOptions,
IDictionary htmlAttributes
)
{
var a = new TagBuilder("a")
{
InnerHtml = linkText
};
a.MergeAttributes(htmlAttributes);
a.MergeAttribute("href", targetUrl);
a.MergeAttributes(ajaxOptions.ToUnobtrusiveHtmlAttributes());
return a.ToString(TagRenderMode.Normal);
}
}
Я знаю, что это старый поток, но вы также можете сделать что-то встроенное по строкам:
<li><span>
@{
var lnk = Ajax.ActionLink("LinkText", "ControllerName", new AjaxOptions {
UpdateTargetId = "div",
InsertionMode = InsertionMode.Replace,
HttpMethod = "GET",
LoadingElementId = "progress"
});
@Html.Raw(lnk.ToString().Replace(">LinkText<", "><span>LinkText</span><"));
// Remember to include the open and closing >< !
}
</span></li>
его взломать я знаю, но вы можете легко написать расширение по этим строкам
насколько сложно достичь этого с помощью JQuery?
мы всегда можем использовать JQuery
и добавить <span></span>
после загрузки DOM.
может быть не идеальным решением, но для разработчиков, использующих jquery, и не хотите писать классы HTML-помощников, как указано выше, это может быть работа.
Я изменил ответ markdotnet, используя пакет аннотаций Jetbrain для предоставления intellisense в параметре actionName. Я также изменил параметр linkText, чтобы улучшить визуализацию кода; VS будет рассматривать его как HTML-код, а не просто строку.
пример:
@Ajax.MyActionLink(
@<div>
<span>Click me</span>
</div>,
"MyAction",
new { Id = 1 },
new AjaxOptions
{
UpdateTargetId = "targed-id",
OnComplete = "oncomplete();"
})
расширения класса:
using System;
using System.Collections.Generic;
using System.Web;
using System.Web.Mvc;
using System.Web.Mvc.Ajax;
using System.Web.WebPages;
using JetBrains.Annotations;
public static class AjaxExtensions
{
public static IHtmlString MyActionLink(
this AjaxHelper ajaxHelper,
Func<dynamic, HelperResult> linkHtml,
[AspMvcAction] string actionName,
AjaxOptions ajaxOptions
)
{
var targetUrl = UrlHelper.GenerateUrl(null, actionName, null, null, ajaxHelper.RouteCollection, ajaxHelper.ViewContext.RequestContext, true);
return MvcHtmlString.Create(ajaxHelper.GenerateLink(linkHtml, targetUrl, ajaxOptions ?? new AjaxOptions(), null));
}
public static IHtmlString MyActionLink(
this AjaxHelper ajaxHelper,
Func<dynamic, HelperResult> linkHtml,
[AspMvcAction] string actionName,
object routeValues,
AjaxOptions ajaxOptions
)
{
System.Web.Routing.RouteValueDictionary routeVals = new System.Web.Routing.RouteValueDictionary(routeValues);
var targetUrl = UrlHelper.GenerateUrl(null, actionName, null, routeVals, ajaxHelper.RouteCollection, ajaxHelper.ViewContext.RequestContext, true);
return MvcHtmlString.Create(ajaxHelper.GenerateLink(linkHtml, targetUrl, ajaxOptions ?? new AjaxOptions(), null));
}
private static string GenerateLink(
this AjaxHelper ajaxHelper,
Func<dynamic, HelperResult> linkHtml,
string targetUrl,
AjaxOptions ajaxOptions,
IDictionary<string, object> htmlAttributes
)
{
var a = new TagBuilder("a")
{
InnerHtml = linkHtml(null).ToString()
};
a.MergeAttributes(htmlAttributes);
a.MergeAttribute("href", targetUrl);
a.MergeAttributes(ajaxOptions.ToUnobtrusiveHtmlAttributes());
return a.ToString(TagRenderMode.Normal);
}
}