如何在MVC4中显示图像网格

本文关键字:显示图 图像 网格 显示 MVC4 | 更新日期: 2023-09-27 18:03:06

我必须像下面这样在MVC-4中显示表格格式的图像

-------------------------------
|  Image  |  image  |  Image  |
-------------------------------
|  Image  |  image  |  Image  |
-------------------------------
|  Image  |  image  |  Image  |
-------------------------------
Paging display records 0-9 of page 1
<<   <   1   2   3   >   >> 

在简单的ASP中。. NET我使用的是数据列表或中继器,在MVC4中,我使用的是部分视图,但我无法在该视图中显示,如上述格式,所以谁能帮助我创建像上面那样的部分视图?

或者如果你有任何更好的主意,那么请指导我应该使用哪种类型的控件。

如果你有任何参考链接,那么它也会对我很有帮助。

视图:

@foreach 
(var item in Model) 
{ 
    <tr> 
    <td>
    @
    {
        string img; 
        if (item.AgentImage != null) 
        { 
            img = item.AgentImage.Replace("~", ".."); 
        } 
        else 
        { 
            img = item.AgentImage; 
        }
    } 
    <img src = '@img' height="80px" width="100px" /> 
    </td> 
    </tr> 
}

如何在MVC4中显示图像网格

如果你的代码在视图中看起来像你在注释中写的。您需要每隔三个元素添加行。对代码最简单的修改如下所示:

 @foreach (var item in Model) { 
    <tr> <td>
        @{
            string img; 
            if (item.AgentImage != null) 
            { img = item.AgentImage.Replace("~", ".."); } 
            else 
            { img = item.AgentImage; }
            var i=0;
            if (i % 3 == 0) {
                Html.Raw("</tr><tr>"); //End old row and start new one
            }
            i++;
        } 
        <img src = '@img' height="80px" width="100px" /> 
    </td></tr> 
}