分页是因为由于一些信息条数过多,在一个页面不能全部显示出来,或者全部显示出来会有很长的滚动条,这就需要分页来实现了。
分页需要两个方法。
第一个方法是根据每页显示多少条信息和当前页的ID,直接查询到指定页的数据;所需要的两个参数:①每页多少条信息②当前页的ID
第二个方法是根据每页显示多少条信息,并且获取到总的信息条数,用"总信息条数"/"每页显示多少条信息",以此来获得总的页数。 需要的参数是:①每页显示多少条信息
下来开始显示代码:注意在路由里要设置默认id=1
1、Models namespace 分页.Models { public class CarBF { private MyDBDataContext _context = new MyDBDataContext(); //需要写两个方法。 //一个方法是点击指定页数,显示出指定页数的信息。需要两个参数,一个参数是一页几条信息;另一个参数是当前页。 public List<car> SelectPageSize(int PageSize,int PageNo) //第一个参数是一页显示几条信息,另一个参数是当前页 { var query = _context.car.Skip(PageSize *( PageNo - 1)).Take(PageSize);//Skip跳过几条信息,Take取几条信息。 假如是第一页,就跳过零条信息,显示Pagesize条信息 return query.ToList(); } //另一个方法是获取到总页数的方法。 public int SelectPageCount(int PageSize) //参数是每页几条信息 { int Count = _context.car.Count();//获取到car表里一共多少条信息 int PageCount = (int)Math.Ceiling((1.0*Count) / PageSize); //总页数=总的信息数/每页显示的信息数 return PageCount; } } } 二、Controllers public class HomeController : Controller { private const int PageSize = 3; //定义一个常量每页显示3条信息 public ActionResult Index(int id) //里面的参数是当前页,这里默认的当前页为第1页 { //需要一个值来获取当前页 ViewBag.PageNo = id;//id就是当前页 //下面开始获取总的页数 int PageCount=new CarBF().SelectPageCount(PageSize);//这是总页数 ViewBag.PageCount = PageCount;//把总页数赋给ViewBag.PageCount //下面开始做一个总页数的下拉列表 List<int> xialalist = new List<int>();//做一个int类型的泛型集合 for (int i = 1; i <= PageCount; i++)//给这个集合赋值 { xialalist.Add(i); } //造一个下拉的集合 SelectList sec = new SelectList(xialalist,id);//把刚才的集合做成下拉列表 ViewBag.sec = sec;//将这个下拉列表的集合赋给ViewBag.sec //获取到当前页的信息 List<car> list=new CarBF().SelectPageSize(PageSize,id); //这里是查出来当前页为第1页的信息 return View(list); } } } 3、Views @{ Layout = null; } @using 分页.Models; @model List<car> <!DOCTYPE html> <html> <head> <meta name="viewport" content="width=device-width" /> <title>Index</title> </head> <body> <div> @{ int PageNo = (int)ViewBag.PageNo;//获取到当前页的信息 int LastPage = PageNo - 1; //获取到上一页的Id int NextPage = PageNo + 1;//获取到下一页Id int PageCount = (int)ViewBag.PageCount;//获取到总页数 SelectList sec = ViewBag.sec as SelectList;//获取到下拉列表的集合 } <ul> @foreach(car data in Model) { <li>@data.name</li> } </ul> @Html.ActionLink("首页", "Index", new {id=1 },null) @Html.ActionLink("上一页", "Index", new { id = LastPage }, new { onclick=LastPage<=0?"return false":"return true"}) @Html.ActionLink("下一页", "Index", new { id = NextPage }, new { onclick=NextPage>PageCount?"return false":"return true"}) @Html.ActionLink("尾页", "Index", new {id=PageCount },null) 转向 @Html.DropDownList("id", sec, new {onchange="change()" }) 页 </div> </body> </html> <script> function change() //写一个下拉里面的值改变时转向相应的页面的函数 { var a = document.getElementById("id").value;//获取到Id为sec对象的值 window.location.href = "/Home/Index/" + a;//页面跳转到Home控制器下的Index动作上,并且将参数a传过去 } </script>
效果图:(只截取部分)