@ Html.PagedListPager添加CSS类

Question

我刚刚在MVC 5中制作了一个完美的分页列表。在每个PagedListPager上，我想添加一个CSS类：

@Html.PagedListPager(Model, page => Url.Action("Toetsstart",
    new { page, sortOrder = ViewBag.CurrentSort, currentFilter = ViewBag.CurrentFilter }))

我怎样才能做到这一点？

Answer 1

使用此重载PagedListPager（参考https://github.com/troygoode/PagedList/blob/master/src/PagedList.Mvc/HtmlHelper.cs）：

public static MvcHtmlString PagedListPager(this System.Web.Mvc.HtmlHelper html,
                                               IPagedList list,
                                               Func<int, string> generatePageUrl,
                                               PagedListRenderOptions options)

然后使用PagedListRenderOptions为您需要的任何元素传递类名（参考：https : //github.com/TroyGoode/PagedList/blob/master/src/PagedList.Mvc/PagedListRenderOptions.cs）

public PagedListRenderOptions()
{
    ...
    ClassToApplyToFirstListItemInPager = null;
    ClassToApplyToLastListItemInPager = null;
    ContainerDivClasses = new [] { "pagination-container" };
    UlElementClasses = new[] { "pagination" };
    LiElementClasses = Enumerable.Empty<string>();
}

Answer 2

可以PagedListRenderOptions像这样添加类：

@Html.PagedListPager(
    model,
    page => Url.Action("Index",
    new
    {
        page,
        sortOrder = ViewBag.CurrentSort,
        currentFilter = viewBag.CurrentFilter
    }
    ),
    new PagedListRenderOptions()
    {
        LiElementClasses = new List<string> {"myClass", "yourClass"}
    })  

您可以在许多地方放置课程，包括：

LiElementClasses
ClassToApplyToFirstListItemInPager
ClassToApplyToLastListItemInPager
ContainerDivClasses
UlElementClasses

Answer 3

如果您希望 X.PagedList Bootstrap 4兼容，请使用：

@Html.PagedListPager((IPagedList)ViewBag.OnePageOfProducts, page => Url.Action("Index", new { page = page }), 
    new PagedListRenderOptions {
        LiElementClasses = new string[] { "page-item" },
        PageClasses = new string[] { "page-link" }
})