1.新建MVC项目
2.在Web项目下添加PagedList
nuget 命令 ：install-package pagedlist.mvc
在安装完成之后，会在Content下添加PagedList.css文件，这个是在分页中会用到的样式
3.有些人用的数据来源是其他地方来的，就用Ilist 的类型进行分页吧
顺便做一下json文件的转换
安装newtonsoft.json
Nuget 命令 ：install-package newtonsoft.json
4.在Models中添加model类型定义 TestModel ，用来转换的
using System; using System.Collections.Generic; using System.Linq; using System.Web; namespace MvcApplication2.Models { public class TestModel { public string Name { get; set; } public int? Age { get; set; } public string Remark { get; set; } } }
5.创建Controller 进行管理，代码中使用局部页添加到index页中，分页之后还是跳转到局部页中，就是随笔一记，不做多的处理
index ACtion中产生数据，并将其计入到静态变量中国
using System; using System.Collections.Generic; using System.Linq; using System.Web; using System.Web.Mvc; using MvcApplication2.Models; using Newtonsoft.Json; using PagedList; namespace MvcApplication2.Controllers { public class PartTestController : Controller { // // GET: /PartTest/ static IList<TestModel> models = new List<TestModel>(); public ActionResult Index() { Random rd = new Random(); models.Add(new TestModel() { Name = "test1", Age = rd.Next(10, 50), Remark = "Remark" }); models.Add(new TestModel() { Name = "test" + rd.Next(1, 50) + "", Age = rd.Next(10, 50), Remark = "Remark" }); models.Add(new TestModel() { Name = "test" + rd.Next(1, 50) + "", Age = rd.Next(10, 50), Remark = "Remark" }); models.Add(new TestModel() { Name = "test" + rd.Next(1, 50) + "", Age = rd.Next(10, 50), Remark = "Remark" }); models.Add(new TestModel() { Name = "test" + rd.Next(1, 50) + "", Age = rd.Next(10, 50), Remark = "Remark" }); models.Add(new TestModel() { Name = "test" + rd.Next(1, 50) + "", Age = rd.Next(10, 50), Remark = "Remark" }); models.Add(new TestModel() { Name = "test" + rd.Next(1, 50) + "", Age = rd.Next(10, 50), Remark = "Remark" }); models.Add(new TestModel() { Name = "test" + rd.Next(1, 50) + "", Age = rd.Next(10, 50), Remark = "Remark" }); models.Add(new TestModel() { Name = "test" + rd.Next(1, 50) + "", Age = rd.Next(10, 50), Remark = "Remark" }); models.Add(new TestModel() { Name = "test" + rd.Next(1, 50) + "", Age = rd.Next(10, 50), Remark = "Remark" }); models.Add(new TestModel() { Name = "test" + rd.Next(1, 50) + "", Age = rd.Next(10, 50), Remark = "Remark" }); models.Add(new TestModel() { Name = "test" + rd.Next(1, 50) + "", Age = rd.Next(10, 50), Remark = "Remark" }); models.Add(new TestModel() { Name = "test" + rd.Next(1, 50) + "", Age = rd.Next(10, 50), Remark = "Remark" }); models.Add(new TestModel() { Name = "test" + rd.Next(1, 50) + "", Age = rd.Next(10, 50), Remark = "Remark" }); models.Add(new TestModel() { Name = "test" + rd.Next(1, 50) + "", Age = rd.Next(10, 50), Remark = "Remark" }); models.Add(new TestModel() { Name = "test" + rd.Next(1, 50) + "", Age = rd.Next(10, 50), Remark = "Remark" }); models.Add(new TestModel() { Name = "test" + rd.Next(1, 50) + "", Age = rd.Next(10, 50), Remark = "Remark" }); models.Add(new TestModel() { Name = "test" + rd.Next(1, 50) + "", Age = rd.Next(10, 50), Remark = "Remark" }); models.Add(new TestModel() { Name = "test" + rd.Next(1, 50) + "", Age = rd.Next(10, 50), Remark = "Remark" }); models.Add(new TestModel() { Name = "test" + rd.Next(1, 50) + "", Age = rd.Next(10, 50), Remark = "Remark" }); models.Add(new TestModel() { Name = "test" + rd.Next(1, 50) + "", Age = rd.Next(10, 50), Remark = "Remark" }); models.Add(new TestModel() { Name = "test" + rd.Next(1, 50) + "", Age = rd.Next(10, 50), Remark = "Remark" }); models.Add(new TestModel() { Name = "test" + rd.Next(1, 50) + "", Age = rd.Next(10, 50), Remark = "Remark" }); models.Add(new TestModel() { Name = "test" + rd.Next(1, 50) + "", Age = rd.Next(10, 50), Remark = "Remark" }); models.Add(new TestModel() { Name = "test" + rd.Next(1, 50) + "", Age = rd.Next(10, 50), Remark = "Remark" }); models.Add(new TestModel() { Name = "test" + rd.Next(1, 50) + "", Age = rd.Next(10, 50), Remark = "Remark" }); models.Add(new TestModel() { Name = "test" + rd.Next(1, 50) + "", Age = rd.Next(10, 50), Remark = "Remark" }); models.Add(new TestModel() { Name = "test" + rd.Next(1, 50) + "", Age = rd.Next(10, 50), Remark = "Remark" }); models.Add(new TestModel() { Name = "test" + rd.Next(1, 50) + "", Age = rd.Next(10, 50), Remark = "Remark" }); models.Add(new TestModel() { Name = "test" + rd.Next(1, 50) + "", Age = rd.Next(10, 50), Remark = "Remark" }); models.Add(new TestModel() { Name = "test" + rd.Next(1, 50) + "", Age = rd.Next(10, 50), Remark = "Remark" }); models.Add(new TestModel() { Name = "test" + rd.Next(1, 50) + "", Age = rd.Next(10, 50), Remark = "Remark" }); models.Add(new TestModel() { Name = "test" + rd.Next(1, 50) + "", Age = rd.Next(10, 50), Remark = "Remark" }); models.Add(new TestModel() { Name = "test" + rd.Next(1, 50) + "", Age = rd.Next(10, 50), Remark = "Remark" }); models.Add(new TestModel() { Name = "test" + rd.Next(1, 50) + "", Age = rd.Next(10, 50), Remark = "Remark" }); models.Add(new TestModel() { Name = "test" + rd.Next(1, 50) + "", Age = rd.Next(10, 50), Remark = "Remark" }); models.Add(new TestModel() { Name = "test" + rd.Next(1, 50) + "", Age = rd.Next(10, 50), Remark = "Remark" }); models.Add(new TestModel() { Name = "test" + rd.Next(1, 50) + "", Age = rd.Next(10, 50), Remark = "Remark" }); models.Add(new TestModel() { Name = "test" + rd.Next(1, 50) + "", Age = rd.Next(10, 50), Remark = "Remark" }); models.Add(new TestModel() { Name = "test" + rd.Next(1, 50) + "", Age = rd.Next(10, 50), Remark = "Remark" }); models.Add(new TestModel() { Name = "test" + rd.Next(1, 50) + "", Age = rd.Next(10, 50), Remark = "Remark" }); models.Add(new TestModel() { Name = "test" + rd.Next(1, 50) + "", Age = rd.Next(10, 50), Remark = "Remark" }); models.Add(new TestModel() { Name = "test" + rd.Next(1, 50) + "", Age = rd.Next(10, 50), Remark = "Remark" }); models.Add(new TestModel() { Name = "test" + rd.Next(1, 50) + "", Age = rd.Next(10, 50), Remark = "Remark" }); models.Add(new TestModel() { Name = "test" + rd.Next(1, 50) + "", Age = rd.Next(10, 50), Remark = "Remark" }); models.Add(new TestModel() { Name = "test" + rd.Next(1, 50) + "", Age = rd.Next(10, 50), Remark = "Remark" }); models.Add(new TestModel() { Name = "test" + rd.Next(1, 50) + "", Age = rd.Next(10, 50), Remark = "Remark" }); models.Add(new TestModel() { Name = "test" + rd.Next(1, 50) + "", Age = rd.Next(10, 50), Remark = "Remark" }); models.Add(new TestModel() { Name = "test" + rd.Next(1, 50) + "", Age = rd.Next(10, 50), Remark = "Remark" }); models.Add(new TestModel() { Name = "test" + rd.Next(1, 50) + "", Age = rd.Next(10, 50), Remark = "Remark" }); models.Add(new TestModel() { Name = "test" + rd.Next(1, 50) + "", Age = rd.Next(10, 50), Remark = "Remark" }); models.Add(new TestModel() { Name = "test" + rd.Next(1, 50) + "", Age = rd.Next(10, 50), Remark = "Remark" }); return View(); } public PartialViewResult PagedListFun(string searchStr, string orderType, int? page) { if (!string.IsNullOrWhiteSpace(searchStr)) { page = 1; } string str = JsonConvert.SerializeObject(models); string jsonstr = str; IList<TestModel> list = JsonConvert.DeserializeObject<IList<TestModel>>(jsonstr); var res = from q in list where q.Name.Contains(searchStr ?? "") select q; //if (orderType.ToLower() == "desc") //{ res = res.OrderByDescending(o => o.Name); //} int pageSize = 3; int pageNumber = (page ?? 1); return PartialView("PagedListFun", res.ToPagedList(pageNumber, pageSize)); } } }
6. 在index中加载页面
@{ Layout = null; ViewBag.Title = "Index"; } <script src="~/Scripts/jquery-1.8.2.js"></script> <h2>Index</h2> <div id="partTime"></div> <script type="text/javascript"> $(function () { $.ajax({ url: "@Url.Action("PagedListFun")", type: "get", data: {name:'mxh'}, success: function (data) { $("#partTime").html(data); }, error:function(error) { $("#partTime").html(error.text); } }); }); </script>
7.在局部也中进行分页处理
@model PagedList.IPagedList<MvcApplication2.Models.TestModel> @using PagedList.Mvc <link href="~/Content/PagedList.css" rel="stylesheet" />@*一定要加入这个，不然没有样式*@ @{ Layout = null; ViewBag.Title = "PagedListFun"; } <ul> @foreach (var item in Model) { <li>@item.Name @item.Age @item.Remark</li> } </ul> Page @(Model.PageCount < Model.PageNumber ? 0 : Model.PageNumber) of @Model.PageCount @Html.PagedListPager(Model, page => Url.Action("PagedListFun", new { page }))