MVC Pager 使用

  MVC Pager  4.0+     3.0版本使用  ,直接来点使用的。一看就明白

      @Ajax.Pager(Model,pagerOptions,mvcAjaxOptions);

@using Webdiyer.WebControls.Mvc;
@model PagedList<UserInfoJson>


@{
    PagerOptions pagerOptions = new PagerOptions()
    {
        PageIndexParameterName = "CurPage",
        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>"
    };
    MvcAjaxOptions mvcAjaxOptions = new MvcAjaxOptions()
    {
        LoadingElementDuration = 300,
        LoadingElementId = "loaddingdiv",
        HttpMethod = "Post",
        InsertionMode = InsertionMode.Replace,
        UpdateTargetId = "update"
    };
}

@{Html.RegisterMvcPagerScriptResource();}

需要注意的是不要忘记注册:  

@section scripts
{
    @{Html.RegisterMvcPagerScriptResource();}
}

如果你使用上面的不行,就试试这个:  @{Html.RegisterMvcPagerScriptResource();}


CurPage  是后台接收参数的 变量名称   必须对应

页面需要引用
@using Webdiyer.WebControls.Mvc;
@model PagedList<UserInfoJson>

注意初始化:@{Html.RegisterMvcPagerScriptResource();}



后台:Action
     var model = new PagedList<UserInfoJson>(r_listobj, dataHelper.CurPage, dataHelper.PageSize, listCount);
            return View(model);
listCount:数据的总数量
r_listobj:数据列表对象
CurPage:当前要访问的页
PageSize:一页多少个


html
    <div class="container-fluid">
        @*@Ajax.Pager(Model, pagerOptions, mvcAjaxOptions);*@
        <div class="row">
            <div class="col-xs-8">
                @Ajax.Pager(Model, pagerOptions, mvcAjaxOptions);
            </div>
            <div class="col-xs-4">
                <div class="input-group" style="margin:20px 0">
                    <span class="input-group-addon">共 @ViewBag.Count 条数据</span>
                    <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>
    </div>

注意:如果你的异步 分页 没有异步刷新 部分视图的话。 那就是你的 分页控件放错位置了。或者 没有注册 脚本。
如果对你有帮助 就赞一下吧。如果有问题 请留言
原文地址:https://www.cnblogs.com/jinhaoObject/p/5318343.html