反正有一个图像作为一个ajax actionlink吗？我只能使用文本让它工作。谢谢你的帮助！
Jonl
问问题
52843 次
21 回答
67
来自 Stephen Walthe，来自他的联系人管理器项目
public static class ImageActionLinkHelper
{
public static string ImageActionLink(this AjaxHelper helper, string imageUrl, string altText, string actionName, object routeValues, AjaxOptions ajaxOptions)
{
var builder = new TagBuilder("img");
builder.MergeAttribute("src", imageUrl);
builder.MergeAttribute("alt", altText);
var link = helper.ActionLink("[replaceme]", actionName, routeValues, ajaxOptions);
return link.Replace("[replaceme]", builder.ToString(TagRenderMode.SelfClosing));
}
}
您现在可以输入您的 aspx 文件：
<%= Ajax.ImageActionLink("../../Content/Delete.png", "Delete", "Delete", new { id = item.Id }, new AjaxOptions { Confirm = "Delete contact?", HttpMethod = "Delete", UpdateTargetId = "divContactList" })%>
于 2009-11-01T19:25:35.320 回答
35
这是我找到的最简单的解决方案：
<%= Ajax.ActionLink("[replacethis]", ...).Replace("[replacethis]", "<img src=\"/images/test.gif\" ... />" %>
Replace() 调用用于将img标签推送到操作链接中。您只需要使用“[replaceme]”文本（或任何其他安全文本）作为临时占位符来创建链接。
于 2009-04-23T03:55:41.670 回答
33
这是对 Black Horus 答案的 Razor/MVC 3（及更高版本）更新：
using System.Web;
using System.Web.Mvc;
using System.Web.Mvc.Ajax;
public static class ImageActionLinkHelper
{
public static IHtmlString ImageActionLink(this AjaxHelper helper, string imageUrl, string altText, string actionName, object routeValues, AjaxOptions ajaxOptions, object htmlAttributes = null)
{
var builder = new TagBuilder("img");
builder.MergeAttribute("src", imageUrl);
builder.MergeAttribute("alt", altText);
builder.MergeAttributes(new RouteValueDictionary(htmlAttributes));
var link = helper.ActionLink("[replaceme]", actionName, routeValues, ajaxOptions).ToHtmlString();
return MvcHtmlString.Create(link.Replace("[replaceme]", builder.ToString(TagRenderMode.SelfClosing)));
}
}
您现在可以输入您的 .cshtml 文件：
@Ajax.ImageActionLink("../../Content/Delete.png", "Delete", "Delete", new { id = item.Id }, new AjaxOptions { Confirm = "Delete contact?", HttpMethod = "Delete", UpdateTargetId = "divContactList" })
2013 年 10 月 31 日：更新了一个额外的参数，以允许为图像元素设置额外的 HTML 属性。用法：
@Ajax.ImageActionLink("../../Content/Delete.png", "Delete", "Delete", new { id = item.Id }, new AjaxOptions { Confirm = "Delete contact?", HttpMethod = "Delete", UpdateTargetId = "divContactList" }, new{ style="border: none;" })
于 2011-06-01T12:34:40.817 回答
6
另一种解决方案是创建自己的扩展方法：
ActionLink<TController>(this HtmlHelper helper, Expression<Action<TController>> action, string linkText, object htmlAttributes, LinkOptions options)
最后一个参数是枚举 LinkOptions
[Flags]
public enum LinkOptions
{
PlainContent = 0,
EncodeContent = 1,
}
然后您可以按如下方式使用它：
Html.ActionLink<Car>(
c => c.Delete(item.ID), "<span class=\"redC\">X</span>",
new { Class = "none left" },
LinkOptions.PlainContent)
我将在我的博客上发布此解决方案的完整描述：http: //fknet.wordpress.com/
于 2009-01-16T16:50:44.343 回答
5
请参阅http://asp.net/mvc上的第 7 版联系人管理器教程。Stephen Walther 有一个创建图像的 Ajax.ActionLink 的示例。
于 2009-03-29T21:02:24.473 回答
5
简短的回答是这是不可能的。您的选择是编写自己的扩展方法以获得 ImageActionLink，这并不难。或者给actionLink添加一个属性，用图片标签替换innerhtml。
于 2008-12-04T19:07:12.293 回答
4
MVC3、Html.ActionImageLink 和 Ajax.ActionImageLink
感谢您帮助我解决这些问题的所有其他答案。
public static MvcHtmlString ActionImageLink(this HtmlHelper helper, string imageUrl, string altText, string actionName, string controller, object routeValues)
{
var builder = new TagBuilder("img");
builder.MergeAttribute("src", imageUrl);
builder.MergeAttribute("alt", altText);
var link = helper.ActionLink("[replaceme]", actionName, controller, routeValues);
return new MvcHtmlString(link.ToHtmlString().Replace("[replaceme]", builder.ToString(TagRenderMode.SelfClosing)));
}
public static MvcHtmlString ActionImageLink(this AjaxHelper helper, string imageUrl, string altText, string actionName, string controller, object routeValues, AjaxOptions ajaxOptions)
{
var builder = new TagBuilder("img");
builder.MergeAttribute("src", imageUrl);
builder.MergeAttribute("alt", altText);
var link = helper.ActionLink("[replaceme]", actionName, controller, routeValues, ajaxOptions);
return new MvcHtmlString(link.ToHtmlString().Replace("[replaceme]", builder.ToString(TagRenderMode.SelfClosing)));
}
于 2011-07-14T01:58:59.283 回答
4
一般解决方案：在操作链接中包含您想要的任何 Razor
使用 Razor 模板委托有一个更好的解决方案，它允许以非常自然的方式在操作链接中插入任何 Razor 代码。因此，您可以添加图像或任何其他代码。
这是扩展方法：
public static IHtmlString ActionLink<T>(this AjaxHelper ajaxHelper,
T item, Func<T,HelperResult> template, string action,
string controller, object routeValues, AjaxOptions options)
{
string rawContent = template(item).ToHtmlString();
MvcHtmlString a = ajaxHelper.ActionLink("$$$", action,
controller, routeValues, options);
return MvcHtmlString.Create(a.ToString().Replace("$$$", rawContent));
}
这是如何使用它：
@Ajax.ActionLink(car,
@<div>
<h1>@car.Maker</h1>
<p>@car.Description</p>
<p>Price: @string.Format("{0:C}",car.Price)</p>
</div>, ...
这允许使用智能感知编写 Razor，并使用您想要的任何对象作为模板（ViewModel 或任何其他对象，如我示例中的汽车）。您可以使用模板内的任何助手来嵌套图像或您想要的任何元素。
Resharper 用户注意事项
如果您在项目中使用 R#，则可以添加R# 注释以改进 Intellisense：
public static IHtmlString ActionLink<T>(this AjaxHelper ajaxHelper, T item,
Func<T, HelperResult> template,
[AspMvcAction] string action, [AspMvcController] string controller,
object routeValues, AjaxOptions options)
于 2013-06-17T15:49:15.743 回答
1
每个答案都很好，但我找到了最简单的一个：
@Html.ActionLink( " ", "Index", "Countries", null, new
{
style = "background: url('../../Content/Images/icon.png') no-repeat center right;display:block; height:24px; width:24px;margin-top:-2px;text-decoration:none;"
} )
请注意，它使用空格 (" ") 作为链接文本。它不适用于空文本。
于 2012-04-11T19:08:16.800 回答
0
.li_inbox { 背景： url(inbox.png) 无重复；填充左：40px；/图片背景 40px / }
<li class="li_inbox" >
@Ajax.ActionLink("Inbox", "inbox","Home", new { },
new AjaxOptions
{
UpdateTargetId = "MainContent",
InsertionMode = InsertionMode.Replace,
HttpMethod = "GET"
})
于 2013-08-05T16:14:12.807 回答
0
第一个解决方案是使用辅助静态方法DecodeLinkContent，如下所示：
DecodeLinkContent(Html.ActionLink<Home>(c => c.Delete(item.ID), "<span class=\"redC\">X</span>",new { Class = "none left"}))
DecodeLinkContent 必须找到第一个“>”和最后一个“<”，并且必须用 HttpUtility.Decode(content) 替换内容。
这个解决方案有点小技巧，但我认为这是最简单的。
于 2009-01-16T16:43:43.923 回答
0
使用 Html 数据属性
<a data-ajax="true" data-ajax-begin="..." data-ajax-success="..." href="@Url.Action("Delete")">
<i class="halflings-icon remove"></i>
</a>
更换
<i class="halflings-icon remove"></i>用自己的形象
于 2015-02-08T14:44:56.683 回答
0
尝试这个
@Html.Raw(HttpUtility.HtmlDecode(Ajax.ActionLink( "<img src=\"/images/sjt.jpg\" title=\"上一月\" border=\"0\" alt=\"上一月\" />", "CalendarPartial", new { strThisDate = Model.dtCurrentDate.AddMonths(-1).ToString("yyyy-MM-dd") }, new AjaxOptions { @UpdateTargetId = "calendar" }).ToString()))
于 2013-08-23T06:33:35.143 回答
0
使用Templated Razor Delegates更新 MVC3依赖于T4Mvc，但带来了如此多的功能。
基于此页面上的各种其他答案。
public static HelperResult WrapInActionLink(this AjaxHelper helper,ActionResult result, Func<object,HelperResult> template,AjaxOptions options)
{
var link=helper.ActionLink("[replaceme]",result,options);
var asString=link.ToString();
var replaced=asString.Replace("[replaceme]",template(null).ToString());
return new HelperResult(writer =>
{
writer.Write(replaced);
});
}
允许：
@Ajax.WrapInActionLink(MVC.Deal.Details(deal.ID.Value),@<img alt='Edit deal details' src='@Links.Content.Images.edit_16_gif'/>, new AjaxOptions() { UpdateTargetId="indexDetails" })
于 2011-12-05T20:21:36.463 回答
0
这里有很好的解决方案，但是如果你想在 actionlink 中拥有更多的图像呢？我就是这样做的：
@using (Ajax.BeginForm("Action", "Controler", ajaxOptions))
{
<button type="submit">
<img src="image.png" />
</button>
}
缺点是我仍然需要对按钮元素进行一些样式设置，但是您可以将所有想要的 html 放在那里。
于 2013-10-10T17:32:59.870 回答
0
使用此扩展生成带有 glifyphicon 的 ajax 链接：
/// <summary>
/// Create an Ajax.ActionLink with an associated glyphicon
/// </summary>
/// <param name="ajaxHelper"></param>
/// <param name="linkText"></param>
/// <param name="actionName"></param>
/// <param name="controllerName"></param>
/// <param name="glyphicon"></param>
/// <param name="ajaxOptions"></param>
/// <param name="routeValues"></param>
/// <param name="htmlAttributes"></param>
/// <returns></returns>
public static MvcHtmlString ImageActionLink(this AjaxHelper ajaxHelper, string linkText, string actionName, string controllerName, string glyphicon, AjaxOptions ajaxOptions, RouteValueDictionary routeValues = null, object htmlAttributes = null)
{
//Example of result:
//<a id="btnShow" href="/Customers/ShowArtworks?customerId=1" data-ajax-update="#pnlArtworks" data-ajax-success="jsSuccess"
//data-ajax-mode="replace" data-ajax-method="POST" data-ajax-failure="jsFailure" data-ajax-confirm="confirm" data-ajax-complete="jsComplete"
//data-ajax-begin="jsBegin" data-ajax="true">
// <i class="glyphicon glyphicon-pencil"></i>
// <span>Edit</span>
//</a>
var builderI = new TagBuilder("i");
builderI.MergeAttribute("class", "glyphicon " + glyphicon);
string iTag = builderI.ToString(TagRenderMode.Normal);
string spanTag = "";
if (!string.IsNullOrEmpty(linkText))
{
var builderSpan = new TagBuilder("span") { InnerHtml = " " + linkText };
spanTag = builderSpan.ToString(TagRenderMode.Normal);
}
//Create the "a" tag that wraps
var builderA = new TagBuilder("a");
var requestContext = HttpContext.Current.Request.RequestContext;
var uh = new UrlHelper(requestContext);
builderA.MergeAttribute("href", uh.Action(actionName, controllerName, routeValues));
builderA.MergeAttributes(HtmlHelper.AnonymousObjectToHtmlAttributes(htmlAttributes));
builderA.MergeAttributes((ajaxOptions).ToUnobtrusiveHtmlAttributes());
builderA.InnerHtml = iTag + spanTag;
return new MvcHtmlString(builderA.ToString(TagRenderMode.Normal));
}
于 2014-11-09T20:48:47.773 回答
0
我发现最好的解决方案是使用带有 type="image" 的输入标签
@using (Ajax.BeginForm( "LoadTest","Home" , new System.Web.Mvc.Ajax.AjaxOptions { UpdateTargetId = "[insert your target tag's id here]" }))
{
<input type="image" class="[css style class here]" src="[insert image link here]">
}
这很容易而且很快。
我已经将它与干扰 AjaxOptions 的其他控件库结合使用，因此我倾向于输入整个 System.Web.Mvc.Ajax.AjaxOptions 以防万一我最终尝试不同的集合。
注意： 我注意到这在 MVC3 中似乎确实存在问题（与 type="image" 有关），但它确实适用于 MVC 4
于 2014-05-14T13:36:43.443 回答
0
所有都是非常好的解决方案，但如果你不喜欢replace在你的解决方案中有一个，你可以试试这个：
{
var url = new UrlHelper(helper.ViewContext.RequestContext);
// build the <img> tag
var imgBuilder = new TagBuilder("img");
imgBuilder.MergeAttribute("src", url.Content(imageUrl));
imgBuilder.MergeAttribute("alt", altText);
string imgHtml = imgBuilder.ToString(TagRenderMode.SelfClosing);
//build the <a> tag
var anchorBuilder = new TagBuilder("a");
anchorBuilder.MergeAttribute("href", url.Action(actionName, controller, routeValues));
anchorBuilder.InnerHtml = imgHtml; // include the <img> tag inside
anchorBuilder.MergeAttributes<string, object>(ajaxOptions.ToUnobtrusiveHtmlAttributes());
string anchorHtml = anchorBuilder.ToString(TagRenderMode.Normal);
return MvcHtmlString.Create(anchorHtml);
}
此外，就我而言，如果我不使用url.Content(imageUrl)，则图像不会显示。
于 2014-03-16T21:58:19.327 回答
0
其他人对我不起作用，因为 .ToHtmlString() 在 MVC 4 中吐出了一个字符串。
下面将一个 id 传递给编辑控件并显示一个编辑图像而不是文本 spag：
@MvcHtmlString.Create(Ajax.ActionLink("Spag", "Edit", new { id = item.x0101EmployeeID }, new AjaxOptions() { UpdateTargetId = "selectDiv", InsertionMode = InsertionMode.Replace, HttpMethod = "GET" }).ToHtmlString().Replace("Spag", "<img src=\"" + Url.Content("../../Images/edit.png") + "\" />"))
于 2017-10-19T08:14:01.253 回答
-1
actionName+"/"+routeValues Proje/ControlName/ActionName/Id
using System.Web;
using System.Web.Mvc;
using System.Web.Mvc.Ajax;
namespace MithatCanMvc.AjaxHelpers
{
public static class ImageActionLinkHelper
{
public static IHtmlString ImageActionLink(this AjaxHelper helper, string imageUrl, string altText, string actionName, string routeValues, AjaxOptions ajaxOptions)
{
var builder = new TagBuilder("img");
builder.MergeAttribute("src", imageUrl);
builder.MergeAttribute("alt", altText);
var link = helper.ActionLink("[replaceme]", actionName+"/"+routeValues, ajaxOptions).ToHtmlString();
return MvcHtmlString.Create(link.Replace("[replaceme]", builder.ToString(TagRenderMode.SelfClosing)));
}
}
}
于 2013-03-11T15:15:04.070 回答
-2
我不知道，这对我来说似乎更容易：
<a href="@Url.Action("index", "home")">
<img src="~/Images/rocket.png" width="25" height="25" title="Launcher" />
</a>
于 2019-02-26T14:46:47.220 回答