有条件地在 webgrid 中显示图像 - mvc 3 [英] Conditionally display an image in webgrid - mvc 3

问题描述

在我的 webgrid 中，我需要根据值显示图像.. 代码如下

In my webgrid I need to display images based on the value .. Code is given below

@model TraktorumMVC.Models.ManagePhotos
@{
    ViewBag.Title = "ManagePhotos";
    Layout = "~/Views/Shared/_Layout.cshtml";
    var grid = new WebGrid(Model.AdPhotos);
}


    @grid.GetHtml(
       displayHeader: false,
       columns: grid.Columns(
             grid.Column(format: (item) =>
                 {
                     if (item.IsMainPreview == true)
                     {
                         return @<text><img src="@Url.Content("~/Content/images/preview-photo.gif")" alt="Image "/></text>;
                     }
                     else
                     {
                         return @<text><img src="@Url.Content("~/Content/images/non-preview-photo.gif")" alt="Image "/></text>;
                     }
                 }
                ),               
             grid.Column(format: (item) => Html.ActionLink("Remove Photo", "RemovePhoto", "Images", new { photoID = @item.Id }, new { @class = "RemovePhoto" }))
         ));

我不确定如何在 webgrid 中使用 if .我刚试过.它不工作.出现以下错误

I am not sure how can i use if in webgrid . I just tried that .Its not working .getting following error

The best overloaded method match for 'System.Web.Helpers.WebGrid.Column(string, string, System.Func<dynamic,object>, string, bool)' has some invalid arguments

推荐答案

在grid.Column 方法的format 参数中，您将一个 lambda 表达式放在一起，以便您可以当然使用if.但问题是当您在 Razor 中处于代码模式"时无法使用 @ 来输出 HTML.所以你需要将创建的图像标签包装成一个 HtmlHelper(就像内置的 Html.ActionLink 有很多 examples) 或使用 HTML.Raw 方法返回 HTML:

In thegrid.Column method's format parameter you are putting together a lambda expression so that you can of course use if. But the problem is you cannot use @ when you are in "code mode" in Razor to output HTML. So you need to wrap the image tag creation into an HtmlHelper (like the built in Html.ActionLink there are lots of examples) or use the HTML.Raw method to return HTML:

@grid.GetHtml(
    displayHeader: false,
    columns: grid.Columns(
            grid.Column(format: (item) =>
                {
                    if (item.IsMainPreview == true)
                    {
                        return Html.Raw(string.Format("<text><img src="{0}" alt="Image"/></text>", Url.Content("~/Content/images/preview-photo.gif")));
                    }
                    else
                    {
                        return Html.Raw(string.Format("<text><img src="{0}" alt="Image"/></text>", Url.Content("~/Content/images/non-preview-photo.gif")));                         
                    }
                }
            ),               
            grid.Column(format: (item) => Html.ActionLink("Remove Photo", "RemovePhoto", "Images", new { photoID = item.Id }, new { @class = "RemovePhoto" }))
        ));

同样在最后一行而不是 new { photoID = @item.Id } 你应该写 new { photoID = item.Id }
要了解有关剃刀的更多信息，请参阅详细的 教程.

Also in the last line instead of new { photoID = @item.Id } you should write new { photoID = item.Id }
To learn more about razor here is a detailed tutorial.

这篇关于有条件地在 webgrid 中显示图像 - mvc 3的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！