WebGrid 中的 MVC3 Ajax.ImageActionLink

发布于 2024-12-13 02:02:24 字数 1923 浏览 3 评论 0原文

我正在尝试使用图像填充 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' 是一种“类型”,但像“变量”一样使用

grid.Column(... format: @HtmlString((item) => @Ajax.ImageActionLink( ... ) ),

错误:“System.Web.HtmlString”是一种“类型”,但像“变量”一样使用

I am trying to populate a WebGrid cell with an image that will open up a "Details" popup based on which row is selected. Currently, I have this for the details column:

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"),

This opens up the popup fine, but there is the text "pop" in the column instead of an image.

I have seen a number of sites talking about creating a separate "ImageActionLink" class to assist in creating ActionLink objects with images. That code looks like this:

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)));
    }
} 

However, I can't seem to get that code to work WITHIN a WebGrid. This is mostly due to the fact that I need the "(item) =>" part to get the ID of the row so that the correct details window will pop up.

How can I get the "Details" column to contain a small icon that will bring up the correct popup when clicked? Thanks in advance.

Edit: Here's a couple ways I tried to use ImageActionLink

grid.Column(... format: (item) => @Ajax.ImageActionLink( ... ) ),

Error: Argument 3: cannot convert from 'lambda expression' to 'System.Func'

grid.Column(... format: (item) => @(new HtmlString(@Ajax.ImageActionLink( ... ) ),

Error: Keyword, identifier, or string expected after verbatim specifier: @

grid.Column(... format: (item) => @HtmlString(@Ajax.ImageActionLink( ... ) ),

Error: 'System.Web.HtmlString' is a 'type' but is used like a 'variable'

grid.Column(... format: @HtmlString((item) => @Ajax.ImageActionLink( ... ) ),

Error: 'System.Web.HtmlString' is a 'type' but is used like a 'variable'

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(1

云雾 2024-12-20 02:02:24

我创建了一个小型复制品,并使用以下语法,它对我有用。一件重要的事情:您需要在视图顶部包含 ImageActionLinkHelper 类的命名空间的 using 。

@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")

I've created a small repro and with the following syntax it's working for me. One important thing: you need to include a using for your namespace of the ImageActionLinkHelper class at the top of your view.

@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")
~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文