如何使用ASP.NET MVC在每个页面上只显示三条记录? [英] How to show just three records on every page with ASP.NET MVC?

查看:94
本文介绍了如何使用ASP.NET MVC在每个页面上只显示三条记录?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我正在编写一个Web应用程序我需要在页面中添加分页但是我有一个问题,例如,我有12条记录。每个页面都显示所有记录,但我想在每个页面上只显示三条记录。我该怎么办?



当然,我使用这些代码。



I'm writing a web application I need a pagination in my page but I have a problem, for example, I have 12 records.all of records shows on every page, but I wanna show just three records on every page.how can I do it?

of course, I use these codes.

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;

namespace EnglishTest.Models
{
    public class Pager
    {
        public Pager(int totalItems, int? page, int pageSize = 10)
        {
            var totalPages=(int)Math.Ceiling((decimal)totalItems/ (decimal)pageSize);
            var currentPage=page !=null ? (int)page : 1;
            var startPage=currentPage-5;
            var endPage=currentPage+4;
            if (startPage <= 0)
            {
                endPage -= (startPage - 1);
                startPage = 1;
            }
            if (endPage > totalPages)
            {
                endPage = totalPages;
                if (endPage > 10)
                {
                    startPage = endPage - 9;
                }
            }

            TotalItems = totalItems;
            CurrentPage = currentPage;
            PageSize = pageSize;
            TotalPages = totalPages;
            StartPage = startPage;
            EndPage = endPage;

        }

        public int TotalItems { get; private set; }
        public int CurrentPage { get; private set; }
        public int PageSize { get; private set; }
        public int TotalPages { get; private set; }
        public int StartPage { get; private set; }
        public int EndPage { get; private set; }
    }
}

=========================================

using EnglishTest.Models;
using System.Web.Mvc;
using System.Linq;
using EnglishTest.ViewModel;
using System.Collections.Generic;

namespace EnglishTest.Controllers
{
    public class HomeController : Controller
    {
        private VocabContext _context;
        public HomeController()
        {
            _context = new VocabContext();
        }
        // GET:
        public ActionResult Dashboard(int? page)
        {
            var dummyItems=_context.Vocabularies.ToList();
            var pager=new Pager(dummyItems.Count(),page);
            var viewModel=new IndexViewModel
            {
                Vocabularies=dummyItems,
                Items=dummyItems.Skip((pager.CurrentPage-1) * pager.PageSize).Take(pager.PageSize),
                Pager=pager
            };
            return View(viewModel);
        }
    }
}

========================================

@model  EnglishTest.ViewModel.IndexViewModel
@{
    ViewBag.Title = "Dashboard";
}
@if (TempData["MessageSuccess"] != null)
{
    <div class="alert alert-success" role="alert">
        Well done! @TempData["MessageSuccess"]
    </div>
}
<div class="row">
    <div class="col-sm-12">
        <div class="element-wrapper">
            <div class="element-box-tp">
                <div class="controls-above-table">
                    <div class="row">
                        <div class="col-sm-6">
                            <a class="btn btn-sm btn-success " href="@Url.Action("New","Vocabulary")">New Word</a>
                        </div>
                        <div class="col-sm-6">
                            <form class="form-inline justify-content-sm-end">
                                <input class="form-control form-control-sm rounded bright" placeholder="Search" type="text">
                            </form>
                        </div>
                    </div>
                </div>
                <div class="table-responsive">
                    <table class="table table-bordered table-lg table-v2 table-striped">
                        <thead>
                            <tr>
                                <th class="text-center"><input class="form-control" type="checkbox"></th>
                                <th>Word</th>
                                <th>Definition</th>
                                <th>Synonym</th>
                                <th>Persian</th>
                                <th>Example</th>
                                <th>Tools</th>
                            </tr>
                        </thead>
                        <tbody>

                            @foreach (var vocab in Model.Vocabularies)
                            {
                                <tr>
                                    <td class="text-center"><input class="form-control" type="checkbox"></td>
                                    <td>@vocab.Word</td>
                                    <td>@vocab.Defination</td>
                                    <td class="text-right">@vocab.Synonym</td>
                                    <td>@vocab.PersianTranslate</td>
                                    <td class="text-center">
                                        @vocab.Examples
                                    </td>
                                    <td class="row-actions"><a href="#">class="os-icon os-icon-pencil-2"></a><a href="#">class="os-icon os-icon-link-3"></a><a class="danger" href="#">class="os-icon os-icon-database-remove"></a></td>
                                </tr>
                            }
                        </tbody>
                    </table>
                </div>
                <div class="controls-below-table">
                    <div class="table-records-info">Showing records 1 - 5</div>
                    <div class="table-records-pages">

                        <ul>

                            @for (var page = Model.Pager.StartPage; page <= Model.Pager.EndPage; page++)
                            {
                                <li>
                                    <a href="~/Home/dashboard?page=@page">@page</a>
                                </li>
                            }
                        </ul>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>





我尝试了什么:



如何在每个页面上只显示三条记录?



What I have tried:

how can I show just three records on every page?

推荐答案

您可以参考以下文章,它将指导您如何使用Jquery DataTables插件实现分页:



在ASP.NET MVC 5中使用服务器端过滤,排序和分页的网格视图 [ ^ ]



希望它有所帮助!
You can refer to the following article which walks you through how to implement pagination using Jquery DataTables plugin:

GridView with Server Side Filtering, Sorting and Paging in ASP.NET MVC 5[^]

Hope it helps!


这篇关于如何使用ASP.NET MVC在每个页面上只显示三条记录?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆