最近接触了一下MvcPager,昂。。。来做个笔记吧

其实，我喜欢前后端分离，分页这种东西前端负责的地方，后端不用顾问，这里的MvcPager有点让我想起服务器控件，毕竟用到了HtmlHelper。

但是挺方便的。。以前我们写分页，后端会封装一Page<T>类，现在我们可以用MvcPager给我们提供好的PageList<T>，功能有点类似，不过MvcPager的功能要强大

一、使用MvcPager这个控件，需要以下支持

1.后端MvcPager.dll引用:

2.前端需要
Css:pagerstyles.css,以及其他主题样式 图片等（PS:我的Demo是用的bootstrap）
Js:Jq,jquery.unobtrusive-ajax.min.js,MvcPager.js(PS:同步的分页不需要全部引用，异步的分页是需要引用的，这里我们暂时都先引用哈)
 
 二、利用MvcPager提供的方法ToPageList进行分页查询，取出数据，返回给前台进行展示

 using System;

 using System.Collections.Generic;

 using System.Linq;

 using System.Web;

 using System.Web.Mvc;

 using System.Web.Routing;

 using System.Web.UI.WebControls;

 using Controllers.Extend;

 using Model;

 using Webdiyer.WebControls.Mvc;

 namespace Controllers.Controllers

 {

     public class MvcPagerController : BaseController

     {

         public ActionResult Search(int pageIndex = , string loginName = null)

         {

             int pageSize = ;

             IQueryable<UserInfo> userInfoList = CurrentBllSession.UserInfoBll.GetIQueryable();

             if (!string.IsNullOrWhiteSpace(loginName))

             {

                 userInfoList = userInfoList.Where(a => a.LoginName.Contains(loginName));

             }

             PagedList<UserInfo> userInfoPagedList = userInfoList.OrderBy(a => a.AddTime).ToPagedList(pageIndex, pageSize);

             ViewData["loginName"] = loginName;

             return View("Index", userInfoPagedList);

         }

         public ActionResult Delete(int id,int pageIndex,string loginName)

         {

             CurrentBllSession.UserInfoBll.Delete(new UserInfo() {UserInfoId = id});

             return RedirectToAction("Search",new{ pageIndex=pageIndex,loginName=loginName});

         }

     }

 }
这里返回PageList<UserInfo>对象给前台的强类型视图，注意这里的form的method=“get”,因为分页条的链接是基于url来进行访问后台的，搜索的参数都是通过url带过去的，如果变为post，那么搜索的功能将会失效。
 
 
 @{

     Layout = null;

 }

 @using Model;

 @using Webdiyer.WebControls.Mvc

 @model PagedList<UserInfo>

 <!DOCTYPE html>

 <html>

 <head>

     <meta name="viewport" content="width=device-width" />

     <title>Index</title>

     <link href="~/Content/Scripts/bootstrap-3.3.5-dist/css/bootstrap.min.css" rel="stylesheet" />

     <link href="~/Content/Scripts/MvcPager/pagerstyles.css" rel="stylesheet" />

 </head>

 <body>

     @*查询*@

     <div style="width:260px;margin:0 auto;">

         <form id="searchForm" action="/MvcPager/Search" method="get">

             <span>用户名：</span>

             <input type="text" name="loginName" id="title" value="@Request.QueryString["loginName"]" style="width:120px" />

             <input type="submit" value="搜索" />

         </form>

     </div>

     <br/>

     @*列表-分页*@

     <div style="width:700px;margin:0 auto;">

         <table class="table table-bordered table-striped">

             <tr>

                 <th>

                     用户名

                 </th>

                 <th>

                     密码

                 </th>

                 <th>

                     创建时间

                 </th>

                 <th>

                     操作

                 </th>

             </tr>

             @{

                 string loginName = (string)(ViewData["loginName"] ?? "");

                 for (int i = 0; i < Model.Count; i++)

                 {

                     <tr>

                         <td>

                             @Model[i].LoginName

                         </td>

                         <td>

                             @Model[i].LoginPassword

                         </td>

                         <td>

                             @Model[i].AddTime.ToString("yyyy-MM-dd")

                         </td>

                         <td>

                             <a href="/MvcPager/Delete/@Model[i].UserInfoId?pageIndex=@Model.CurrentPageIndex&loginName=@loginName">删除</a>

                         </td>

                     </tr>

                 }

             }

         </table>

         <div class="text-center">

             @Html.Pager(Model, new PagerOptions

             {

                 //ControllerName = "MvcPager",//默认的Controller和Action是由Url来决定，这里也可以手动更改

                 //ActionName = "Search",

                 PageIndexParameterName = "pageIndex",

                 ContainerTagName = "ul",

                 FirstPageText = "首页",

                 PrevPageText = "上一页",

                 NextPageText = "下一页",

                 LastPageText = "末页",

                 CssClass = "pagination",

                 PagerItemTemplate = "<li>{0}</li>",

                 CurrentPagerItemTemplate = "<li class='active'><a href='#'>{0}</a></li>",

                 DisabledPagerItemTemplate = "<li class='disabled'><a>{0}</a></li>",

                 Id = "bootstrappager",

             })

         </div>

     </div>

 </body>

 </html>

 <script src="~/Content/Scripts/jquery-2.0.3.min.js"></script>

 <script src="~/Content/Scripts/MvcPager/jquery.unobtrusive-ajax.min.js"></script>

 <script src="~/Content/Scripts/MvcPager/MvcPager.js"></script>

主要是这张图，设置分页条的代码，这里用到了MvcPager的分页功能,是对HtmlHelper的扩展

三、效果图

MvcPager使用的Demo（同步分页）的更多相关文章

  1. javascript同步分页

    目前网上分页的例子比较多,但是对其原理不是很了解,平时用的时候只是拿来调用,今天花了点时间,采用面向对象方式写了一个demo.对其方法做了封装,对外只提供一个调用接口. window.loadPage ...

  2. 【要什么自行车】ASP.NET MVC4笔记01：Asp.net MVC 分页，采用 MvcPager 和CYQ.Data来分页

    Control: ) { ; ; using (MAction action = new MAction("brain")) { MDataTable table = action ...

  3. MVC分页之MvcPager使用

    最近刚刚接触MVC不久,因项目中要用到分页,网上找了下资料,最后采用了MvcPager(http://www.webdiyer.com/),支持同步和Ajax异步分页.废话不多说了直接上代码. 一.M ...

  4. MvcPager分页控件以适用Bootstrap

    随笔- 9  文章- 0  评论- 33  修改MvcPager分页控件以适用Bootstrap 效果(含英文版,可下载)   软件开发分页效果必不可少,对于Asp.Net MVC 而言,MvcPag ...

  5. 修改MvcPager分页控件以适用Bootstrap 效果(含英文版,可下载)

    软件开发分页效果必不可少,对于Asp.Net MVC 而言,MvcPager 是个不错的选择.请访问http://www.webdiyer.com/mvcpager/ 由于自带的分页样式不能和项目整体 ...

  6. MvcPager 概述 MvcPager 分页示例 — 标准Ajax分页 对SEO进行优化的ajax分页 (支持asp.net mvc)

    该示例演示如何使用MvcPager最基本的Ajax分页模式. 使用AjaxHelper的Pager扩展方法来实现Ajax分页,使用Ajax分页模式时,必须至少指定MvcAjaxOptions的Upda ...

  7. 5种风格的 jQuery 分页效果【附代码】

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xht ...

  8. jQuery异步分页插件

    学校软件工程让写课程设计(其实就是自选语言做个项目),感觉都是重复的东西就没有很认真的去写内容,更加注意写一些之前没有用过的东西. 因为一直都使用TP框架来写PHP,TP又自带分页类,想到这里就想试试 ...

  9. 21个很棒的jQuery分页插件下载

    分页是指将一个大内容划分为各种不同的页面,因此网站的分页是一个很重要的部分,必须让内容有组织性和易于访问.分页有各两种不同的方式,手动跟自动.最受欢迎简单和广泛的方法是jQuery插件.下面我们收集了 ...

随机推荐

  1. NSURLSession详解

    导语 现在NSURLConnection在开发中会使用的越来越少,iOS9已经将NSURLConnection废弃,现在最低版本一般适配iOS7,所以也可以使用. NSURLConnection相对于 ...

  2. kafka

    2016-11-13  20:48:43 简单说明什么是kafka? Apache kafka是消息中间件的一种,我发现很多人不知道消息中间件是什么,在开始学习之前,我这边就先简单的解释一下什么是消息 ...

  3. CodingLife主题更新

    收到反馈说CodingLife主题某些地方显示有问题,于是进行了更新,并且已提交.官方那边正在进行测试,我自己这边测完应该是没问题的,但不知道官方啥时候会进行更新,所以把CSS代码贴出来,有需要的可以 ...

  4. Lesson 24 It could be worse

    Text I entered the hotel manager's office and sat down. I had just lost £50 and I felt very upset. ' ...

  5. handlebars自定义helper的写法

    handlebars相对来讲算一个轻量级.高性能的模板引擎,因其简单.直观.不污染HTML的特性,我个人特别喜欢.另一方面,handlebars作为一个logicless的模板,不支持特别复杂的表达式 ...

  6. Leetcode 笔记 101 - Symmetric Tree

    题目链接:Symmetric Tree | LeetCode OJ Given a binary tree, check whether it is a mirror of itself (ie, s ...

  7. 到爱尔兰敲代码 / Come, Coding in Ireland

    这是我在都柏林的第四个月,该办的证也都办完了,该安定下来的也安定下来了,所以也简单介绍下到爱尔兰做IT的相关过程和政策. 如果有兴趣在英语环境工作的话,我也可以帮忙推荐或者找找. 去年15年1月正好开 ...

  8. hibernate学习笔记之二 基本环境搭建

    1.创建一个普通的java项目 2.加入Hibernate所有的jar包 3.建立包名com.bjpowernode.hibernate 4.建立实体类User.java package com.bj ...

  9. WCF学习之旅—WCF服务的WAS寄宿（十二）

    上接    WCF学习之旅—WCF服务部署到IIS7.5(九) WCF学习之旅—WCF服务部署到应用程序(十) WCF学习之旅—WCF服务的Windows 服务程序寄宿(十一) 八.WAS宿主 IIS ...

  10. JavaScript高级编程 (1) - javscript是什么

    <重温javascript>这是一系列 javascript 的学习笔记,部分内容摘自书本或者网络,我这里只是基于自己的理解进行了梳理整理. 一个完整的 javscript 实现是由以下3 ...