[Asp.Net Core] - 使用 ViewComponents 实现分页控件

2021-06-20 12:04

阅读:608

标签:https   doc   user   lis   hosting   protect   onclick   logging   else   

 

分页控件(定义分页参数)

~/ViewComponents/PaginationViewComponent.cs

using HelloWorld.DataContext;
using Microsoft.AspNetCore.Hosting;
using Microsoft.AspNetCore.Mvc;
using Microsoft.Extensions.Logging;

namespace HelloWorld.ViewComponents
{
    public class PaginationViewComponent : ViewComponent
    {
        protected readonly IHostingEnvironment Env;
        protected readonly AppBusinessDbContext BusinessDbContext;
        protected readonly ILogger Logger;

        public PaginationViewComponent(IHostingEnvironment env, AppBusinessDbContext context, ILoggerFactory loggerFactory)
        {
            Env = env;
            BusinessDbContext = context;
            Logger = loggerFactory.CreateLogger();
        }

        public IViewComponentResult Invoke()
        {
            return View();
        }
    }
}

~/Views/Shared/Components/Pagination/Default.cshtml

nav>
    ul class="pagination">
        @{
            const int pageIncrement = 2;
            const int pageTrailing = 5;
            var totalPageCount = ViewBag.TotalPageCount == null ? 1 : (int)ViewBag.TotalPageCount;
            if (totalPageCount > 1)
            {
                var pageIndex = ViewBag.CurrentPageIndex == null ? 1 : (int)ViewBag.CurrentPageIndex;
                var pageRangeStart = pageIndex = pageIncrement ? 1 : pageIndex - pageIncrement;
                var pageRangeEnd = pageIndex + pageIncrement = totalPageCount ? (totalPageCount > pageTrailing && pageIndex + pageIncrement  pageTrailing ? pageTrailing : pageIndex + pageIncrement) : totalPageCount;
                if (pageRangeStart > 1)
                {
                    li class="page-item">
                        input name="id" type="submit" class="page-link" style="cursor: pointer;" value="1" />
                    li>
                    if (pageRangeStart > 2)
                    {
                        li class="page-item disabled">
                            input name="id" type="submit" class="page-link" style="cursor: pointer;" value="..." />
                        li>
                    }
                }
                for (var i = pageRangeStart; i = pageRangeEnd; i++)
                {
                    
  • ="page-item @(pageIndex == i ? "active" : null)"> input name="id" type="submit" class="page-link" style="cursor: pointer;" value="@i" /> li> } if (pageRangeEnd totalPageCount) { if (pageRangeEnd + 1 ="page-item disabled"> input name="id" type="submit" class="page-link" style="cursor: pointer;" value="..." /> li> } li class="page-item"> input name="id" type="submit" class="page-link" style="cursor: pointer;" value="@totalPageCount" /> li> } } } ul> nav>
  •  

    列表页面(更新分页参数)

    ~/Controllers/ArticleController.cs

            public async Task List(int id, string keyword)
            {
                ViewBag.KeyWord = keyword;
                ViewBag.CurrentPageIndex = id  : id;
                ViewBag.TotalPageCount = 1;
                if (!ModelState.IsValid) return View();
    
                List list;
                if (string.IsNullOrEmpty(keyword))
                {
                    list = await _businessDbContext.News.Join(_businessDbContext.Mapping, r => r.Gid, m => m.Gid, (r, m) => new { r, m })
                                 .Where(t => t.r.Active && t.m.UserGid == UserGid).OrderByDescending(t => t.r.Created).Select(t => t.r).ToListAsync();
                }
                else
                {
                    keyword = keyword.ToLower().Trim();
                    list = await _businessDbContext.News.Join(_businessDbContext.Mapping, r => r.Gid, m => m.Gid, (r, m) => new { r, m })
                        .Where(t => t.r.Active && t.m.UserGid == UserGid && !string.IsNullOrEmpty(t.r.Title) && t.r.Title.ToLower().Contains(keyword))
                        .OrderByDescending(t => t.r.Created)
                        .Select(t => t.r).ToListAsync();
                }
                var tmpTotalCount = list.Count;
                ViewBag.TotalPageCount = (tmpTotalCount / PageSize) + (tmpTotalCount % PageSize == 0 ? 0 : 1);
                var result = list.Skip(PageSize * (id - 1)).Take(PageSize).Select(ResumeBasicViewModel.ConvertToViewModel).ToList();
                return View(result);
            }

    ~/Views/Article/List.cshtml

            nav class="navbar navbar-light bg-faded">
                form asp-controller="Candidate" asp-action="List" method="GET">
                    div class="row">
                        div class="col-6">
                            @await Component.InvokeAsync("Pagination")
                        div>
                        div class="col-4">
                            input type="text" name="keyword" class="form-control" maxlength="50" placeholder="关键字" value="@ViewBag.KeyWord"/>
                        div>
                        div class="col-1" style="padding-left: 0;">
                            button class="form-control btn btn-success" type="submit">检 索button>
                        div>
                        div class="col-1" style="padding-left: 0;">
                            button class="form-control btn btn-secondary" type="submit" onclick="fnClearKeyword()">清 空button>
                        div>
                    div>
                form>
            nav>

     

    分页效果

    技术分享

     

    参考资料

    https://docs.microsoft.com/en-us/aspnet/core/mvc/views/view-components

    [Asp.Net Core] - 使用 ViewComponents 实现分页控件

    标签:https   doc   user   lis   hosting   protect   onclick   logging   else   

    原文地址:http://www.cnblogs.com/jinzesudawei/p/7189892.html

    上一篇:hibernate03增删改查

    下一篇:jQuery-ajax


    评论


    亲,登录后才可以留言!