我正在尝试使用图像填充WebGrid单元格,该图像将根据选择的行打开“详细信息”弹出窗口。目前,我有详细信息列:
grid.Column(header: "Details", format: (item) => @Ajax.ActionLink("pop", "GetDetails", new { id = item.FormId }, new AjaxOptions { HttpMethod = "GET", UpdateTargetId = "formdetails", InsertionMode = InsertionMode.Replace, OnSuccess = "openPopup" })
, style: "colImages"),
这会打开弹出窗口,但是列中的文字“pop”而不是图像。
我见过许多网站都在讨论如何创建一个单独的“ImageActionLink”类来帮助创建带有图像的ActionLink对象。该代码如下所示:
public static class ImageActionLinkHelper
{
public static IHtmlString 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).ToHtmlString();
return new MvcHtmlString(link.Replace("[replaceme]", builder.ToString(TagRenderMode.SelfClosing)));
}
}
但是,我似乎无法让代码在WebGrid中工作。这主要是因为我需要“(item)=>”部分获取行的ID,以便弹出正确的详细信息窗口。
如何让“详细信息”列包含一个小图标,在点击时会弹出正确的弹出窗口?提前谢谢。
编辑:以下是我尝试使用ImageActionLink的几种方法
grid.Column(... format: (item) => @Ajax.ImageActionLink( ... ) ),
错误:参数3:无法从'lambda表达式'转换为'System.Func'
grid.Column(... format: (item) => @(new HtmlString(@Ajax.ImageActionLink( ... ) ),
错误:在逐字说明符后预期的关键字,标识符或字符串:@
grid.Column(... format: (item) => @HtmlString(@Ajax.ImageActionLink( ... ) ),
错误:'System.Web.HtmlString'是'type',但用作'变量'
grid.Column(... format: @HtmlString((item) => @Ajax.ImageActionLink( ... ) ),
错误:'System.Web.HtmlString'是'type',但用作'变量'
答案 0 :(得分:2)
我已经创建了一个小型repro,并且使用以下语法,它对我有用。一件重要的事情是:您需要在视图顶部为ImageActionLinkHelper
类的命名空间添加一个用法。
@using namespaceofImageActionLinkHelper
...
grid.Column(header: "Details",
format: (item) =>
@Ajax.ImageActionLink(
@Url.Content("~/Content/images/image.jpg"),
"alt of the image",
"GetDetails",
new { id = item.FormId },
new AjaxOptions { HttpMethod = "GET", UpdateTargetId = "formdetails", InsertionMode = InsertionMode.Replace, OnSuccess = "openPopup" })
, style: "colImages")