• ASP.Net MVC4.0+无刷新分页


    新建项目后必须引用MvcPager.dll    注意引用4.0+版本以上哦

    分页控制器

    using System;
    using System.Collections.Generic;
    using System.Configuration;
    using System.Linq;
    using System.Web;
    using System.Web.Mvc;
    using Webdiyer.WebControls.Mvc;
    
    namespace MvcDemo.Controllers
    {
        public class PageUnitController : Controller
        {
            // GET: PageUnit
            public ActionResult Index(int? id, string name)
            {
                List<Person> data = new List<Person>();
                for (int i = 0; i < 100; i++)
                {
                    data.Add(new Person(){ID=i,Name="Name"+i});
                }
                id = id ?? 1;
                int pageSize = 3;
                //IQueryable<Person> temp = db.Person.Where(c =>true).OrderBy(c=>c.ID);
                IQueryable<Person> temp = data.AsQueryable();
                PagedList<Person> pageList = temp.AsQueryable<Person>().ToPagedList<Person>(id.Value, pageSize);
                if (Request.IsAjaxRequest())
                {
                    return PartialView("_ParIndex", pageList);
                }
                return View(pageList);
            }
        }
    
        public class Person 
        {
            public int ID { get; set; }
            public string Name { get; set; }
        }
    }
    View Code

    视图

    @using Webdiyer.WebControls.Mvc
    @model PagedList<MvcDemo.Controllers.Person>
    @{
        ViewBag.Title = "Index";
    }
    <div id="articles">
        @Html.Partial("_ParIndex", Model)
    </div>
    @section scripts{@{Html.RegisterMvcPagerScriptResource();}} 

    此处注意,一定要加上最后一句话@section scripts{@{Html.RegisterMvcPagerScriptResource();}}  ,否则无刷新失效,页码跳转也失效哦

    分部视图

    @using Webdiyer.WebControls.Mvc
    @model Webdiyer.WebControls.Mvc.PagedList<MvcDemo.Controllers.Person>
    <table class="table table-bordered table-striped">
        <tr>
            <th class="nowrap">序号</th>
            <th>
                姓名
            </th>
        </tr>
        @foreach (var item in Model)
        {
            <tr>
                <td>
                    @Html.DisplayFor(modelItem => item.ID)
                </td>
                <td>
                    @Html.DisplayFor(modelItem => item.Name)
                </td>
            </tr>
        }
    </table>
    
    @*下拉选择跳转*@
    <div class="row">
        <div class="col-xs-8">
            @Ajax.Pager(Model, new PagerOptions { FirstPageText = "<<", LastPageText = ">>", NextPageText = ">", PrevPageText = "<", PageIndexParameterName = "id", NumericPagerItemCount = 5, ContainerTagName = "ul", CssClass = "pagination", CurrentPagerItemTemplate = "<li class="active"><a href="#">{0}</a></li>", DisabledPagerItemTemplate = "<li class="disabled"><a>{0}</a></li>", PagerItemTemplate = "<li>{0}</li>", PageIndexBoxId = "pageIndexBox" }).Options(o => o.AddRouteValue("target", "articles")).AjaxOptions(a => a.SetUpdateTargetId("articles"))
        </div>
        <div class="col-xs-4">
            <div class="input-group" style="margin:20px 0">
                <span class="input-group-addon">转到第</span>
                <select id="pageIndexBox" class="form-control input-sm"></select>
                <span class="input-group-addon">页</span>
            </div>
        </div>
    </div>
    
    @*输入跳转到指定页*@
    @*<div class="row">
            <div class="col-xs-8">
                @Ajax.Pager(Model, new PagerOptions { FirstPageText = "<<", LastPageText = ">>", NextPageText = ">", PrevPageText = "<", ContainerTagName = "ul", PageIndexParameterName = "id",NumericPagerItemCount = 5, CssClass = "pagination", CurrentPagerItemTemplate = "<li class="active"><a href="#">{0}</a></li>", DisabledPagerItemTemplate = "<li class="disabled"><a>{0}</a></li>", PagerItemTemplate = "<li>{0}</li>", PageIndexBoxId = "pageIndexBox2", GoToButtonId = "goToBtn2" }).Options(o => o.AddRouteValue("target", "articles")).AjaxOptions(a => a.SetUpdateTargetId("articles"))
            </div>
            <div class="col-xs-4">
                <div class="input-group" style="margin:20px 0">
                    <span class="input-group-addon">转到第</span>
                    <input type="text" id="pageIndexBox2" class="form-control input-sm" />
                    <span class="input-group-addon">页</span>
                    <span class="input-group-btn"><button class="btn btn-primary btn-sm" id="goToBtn2">跳转</button></span>
                </div>
            </div>
        </div>*@
    View Code

    参考地址:http://www.webdiyer.com/mvcpager/demos/ajaxpagers/

  • 相关阅读:
    在win8.1 64位环境下有关Oracle的安装和卸载
    动手又动脑
    二柱子四则运算(课堂练习)
    Java学生成绩绩点管理系统
    小学期第八周收获
    小学期第七周收获
    小学期第六周收获
    小学期第五周收获
    《大道至简》读后感
    小学期第四周收获
  • 原文地址:https://www.cnblogs.com/SmilePastaLi/p/7526941.html
Copyright © 2020-2023  润新知