Question

如何使HTML table仅显示10条记录，每当超过10条时，它会显示以下页面的链接？例如“1,2,3 ..”并限制最多7个链接，如YouTube显示它（见下图）？顺便说一下，我正在使用ASP.Net MVC和Bootstrap。

<table id="userTbl" onclick="getTblRec('userTbl,'userBody','0')" class="table-scroll table-striped bootgrid-table">
    <thead>
        <tr>
            <th class="hidden">
                @Html.DisplayNameFor(model => model.USR_ID)
            </th>
            <th class="hidden">
                @Html.DisplayNameFor(model => model.USR_FNAME)
            </th>
        </tr>
    </thead>
    <tbody id="userBody">
        @foreach (var item in Model)
        {
            <tr>
                <td id="userId" class="hidden">
                    @Html.DisplayFor(modelItem => item.USR_ID)
                </td>
                <td>
                    @Html.DisplayFor(modelItem => item.USR_FNAME)
                </td>
                <td>
            </tr>
        }
    </tbody>
</table>

YouTube示例图片

Answer 1

有两种实现分页的方式，即服务器端和客户端端。首先是服务器实现，只从服务器加载要为页面显示的项目集以及页面选项。客户端的分页，加载整个项目集，并提供表格和/或其他控件的支持分页。两种选择都有利有弊。这些链接可让您开始使用主题link1，link2。

Answer 2

由于您使用的是ASP.NET MVC，因此对于诸如分页之类的方案，有一个名为WebGrid的帮助程序。这非常易于使用，并提供您可能需要的几乎所有功能。

您还可以查看此初学者级别的演练。 WebGrid in asp.net mvc (By Sheo Narayan)

Answer 3

对分页进行部分查看，如果您的记录超过10，则调用该部分视图。即在此链接中Paging

或者您也可以安装此nuget，您的愿望风格将能够设计这是nuget Nuget Packege的链接

表中的记录数分为页面 - ASP.Net MVC Bootstrap

3 个答案: