如何在 MVC Razor 视图中使用/显示 Asp.net DataList答案

【问题标题】：How to Use/ Display a Asp.net DataList in MVC Razor View如何在 MVC Razor 视图中使用/显示 Asp.net DataList
【发布时间】：2014-03-26 12:22:47
【问题描述】：

我在下面有这个列表，我使用 Razor 视图即时生成：

<table id="contractCoverablesGrid">
    <tbody>
        @foreach (var coverableItem in Model.ContractCoverablesList)
        {
            <tr>
                <td>
                    @Html.Hidden("coverID",coverableItem.CoverID)
                </td>
                <td>
                    @Html.Label(coverableItem.Name)
                </td>
                <td>
                    <input type='checkbox' class='chkboxActive' checked='checked' />
                </td>
            </tr>
        }
    </tbody>
</table>

您可以想象得到的结果是一个垂直的列表，它不断向下延伸。

我希望将此列表“包装”成三个相邻的列，而不是一个长列；就像您在 ASP.net Datalist 服务器控件（在 Webforms 中）中执行此操作一样。

我最初的想法是限制表格的宽度和高度以设置值，然后继续向左浮动 td(s)。但是我如何浮动 td.我不能把它变成 div。

有什么想法吗？

请告诉我。

【问题讨论】：

标签： asp.net-mvc css asp.net-mvc-4 razor

【解决方案1】：

您可以尝试使用 for 而不是 foreach。您将遍历除以 3 的列表并每次开始一个新的 td。

【讨论】：

谢谢，正如您在上面看到的那样，我解决的方法略有不同。

【解决方案2】：

我就是这样解决的：

<table id="contractCoverablesGrid" width="600" align="center">
    <tbody>
        <tr>
            @foreach (var coverableItem in Model.ContractCoverablesList)
            {
                <td>
                    <div id="dataListItem">
                        @Html.Hidden("coverableID", coverableItem.CoverID)
                        @Html.Label(coverableItem.Name)
                        <input type='checkbox' name="coverableItemCheckBox" id="coverableItemCheckBox" />
                    </div>
                </td>
            }
        </tr>
    </tbody>
</table>

<style>
    #dataListItem {
        float: left;
        font-weight: normal;
    }
</style>

【讨论】：