在一个HTML页面上使用多个分页列表

时间:2019-02-02 10:38:17

标签: asp.net-mvc razor asp.net-core razor-pages

我是MVC / Razor页面的新手,所以请多多包涵。我想在一页上显示多个项目列表。这些列表每个都有100多个项目,因此需要分页。在Microsoft的Entity Framework .net核心教程中,我发现每页只有1个分页,因此无法使用。

我觉得我应该使用View Component来实现这一点,但是我不太确定该怎么做。谁能帮我吗? 我正在使用Razor页面.net Core,但我不反对使用控制器来实现这一目标

预先感谢

我的看法是:

@page
@model DOOR.Core.Web.Pages.Models.IndexModel

<h2 style="margin-top:20px "><span class="glyphicon glyphicon-compressed"></span> Model @Html.DisplayFor(model => Model.
<h4 class="h4-bold">Tables</h4>
@if (Model.PdModel.FirstOrDefault().PdTables.Count == 0)
{
    @:Model doesn't contain any tables
}
else
{
    <table class="table table-striped">
        <thead>
        <th>
            Name
        </th>
        <th>
            Description
        </th>
        <th>
            Type
        </th>
        </thead>
        @foreach (var tableItem in Model.PdModel.FirstOrDefault().PdTables.OrderBy(x => x.TableName))
        {

            <tr>
                <td>
                    <a asp-page="/Tables/Index" asp-route-id="@tableItem.Id" asp-page-handler="LoadTable"><span class="glyphicon glyphicon-list-alt"></span> @tableItem.TableName</a>
                </td>
                <td>
                    @tableItem.TableComment
                </td>
                <td>
                    @tableItem.TableStereotype
                </td>
            </tr>
        }
    </table>
}
<hr />

<h4 class="h4-bold">View</h4>
@if (Model.PdModel.FirstOrDefault().pdViews.Count == 0)
{
    @:Model doesn't contain any view
}
else
{
    <table class="table table-striped">
        <thead>
        <th>Name</th>
        <th>Description</th>
        </thead>

        @foreach (var viewitem in Model.PdModel.FirstOrDefault().pdViews.OrderBy(x => x.ViewName))
        {

            <tr>
                <td><a asp-page="/Views/index" asp-page-handler="LoadView" asp-route-id="@viewitem.ID"><i class="glyphicon glyphicon-search"></i> @viewitem.ViewCode</a></td>
                <td>@viewitem.ViewComment</td>
            </tr>
        }
    </table>
}

我的域模型是:

public class PdModel
{
    public int Id { get; set; }
    public string ModelCode { get; set; }
    ...
    public ICollection<PdTable> PdTables { get; set; }
    public ICollection<PdView> pdViews { get; set; }
}

public class PdTable
{
    public int Id { get; set; }
    public int ModelId { get; set; }
    public string ModelCode { get; set; }
    public string TableCode { get; set; }
    ...
    [ForeignKey("ModelId")]
    public virtual PdModel PdModels { get; set; }
}

public class PdView
{
    public int ID { get; set; }
    public string ModelCode { get; set; }
    public int ModelID { get; set; }
    public string ViewCode { get; set; }
    ...
    [ForeignKey("ModelID")]
    public virtual PdModel PdModel { get; set; }
}

我的方法是:

public PaginatedList<PdModel> PdModel { get; set; }

        public async Task OnGetLoadModelAsync(int id, int? pageIndex)
        {
            IQueryable<PdModel> PdModelsQuer = _context.PdModel.Where(x => x.Id == id)
                                    .Include(x => x.PdTables)
                                    .Include(x => x.pdViews)

            PdModel = await PaginatedList<PdModel>.CreateAsync(PdModelsQuer, pageIndex ?? 1, 3);

        }

2 个答案:

答案 0 :(得分:0)

不是最佳解决方案,而是尝试这种方法:您可以为每个项目创建单独的表,然后将分页链接到每个表

答案 1 :(得分:0)

不确定您是否找到了解决方案,但我喜欢使用该库

https://www.nuget.org/packages/X.PagedList.Mvc.Core/

要对不同的模型进行分页,只需创建一个包含IPagedList对象的视图模型即可。

以下是如何设置分页控件的示例:

CAShapeLayer

如果文档和/或解释不清楚,我可以提供更深入的示例。