如何在MVC4中顯示圖像網格

Question

我必須在MVC-4中以下面的表格格式顯示圖像

-------------------------------
|  Image  |  image  |  Image  |
-------------------------------
|  Image  |  image  |  Image  |
-------------------------------
|  Image  |  image  |  Image  |
-------------------------------

Paging display records 0-9 of page 1

<<   <   1   2   3   >   >> 

對於這個在簡單的ASP.NET我使用DataList或轉發器，在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> 
}

Answer 1

如果您在視圖中的代碼看起來像是在評論中寫的。 您需要每隔三個元素添加一行。 對代碼的最簡單更改可能如下所示：

 @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> 
}