Question

我正在尝试在我的MVC3应用程序中使用WebGrid，并在我的网格中使用两列Headers我想显示图像。所以请举一些例子。通过使用“格式”选项我在列中显示图像但不在标题中显示图像所以请告诉我如何在网格中显示它

Answer 1

如果要显示多张图片，可以在视图中使用 Html.ActionLink 属性，如下所示。在此示例中，我使用详细信息/编辑/删除图像作为操作列下的按钮。

注意：根据您的项目在Html.ActionLinks中输入“Title”，“Controller”和“Action”名称。如果您使用空标题，只需使用“”。

....
//for using multiple Html.ActionLink in a column using Webgrid
grid.Column("Operations", format: (item) =>
 new HtmlString(
       Html.ActionLink("Show Details", "Edit", "Admin", new
       {
           applicantId = item.ApplicantID,               
           title = "Detail",
           @class = "icon-link",
           style = "background-image: url('../../Content/icons/detail.png')"
       }, null).ToString() +
       Html.ActionLink("Edit Record", "Edit", "Admin", new
       {
           applicantId = item.ApplicantID, 
           title = "Edit",
           @class = "icon-link",
           style = "background-image: url('../../Content/icons/edit.png')"
       }, null).ToString() +
       Html.ActionLink("Delete Record", "Edit", "Admin", new
       {
           applicantId = item.ApplicantID,
           title = "Delete",
           @class = "icon-link",
           style = "background-image: url('../../Content/icons/delete.png')"
       }, null).ToString()
 )
)
....


<style type="text/css">
    a.icon-link {
        background-color: transparent; 
        background-repeat: no-repeat; 
        background-position: 0px 0px;
        border: none;
        cursor: pointer; 
        width: 16px;
        height: 16px;
        margin-right: 8px; 
        vertical-align: middle;
    }
</style>

对于我的完整示例，您可以在此处查看：How to use WebGrid in a cshtml view?

问候。

如何在WebGrid标题上显示图像

1 个答案: