MvcPager2.0 中分页初始化失败的问题

Posted 2020-06-14

页面初始化时只有一页数据，或没数据时，出现分页控件初始化失败以及后续Ajax分页功能失效的问题，

<div class="pagin">
    <div class="message">
        @{int totalItemCount = Model == null ? 20 : Model.TotalItemCount;}
        @{int currentPageIndex = Model == null ? 2 : Model.CurrentPageIndex;}
        共
        <i class="blue">@totalItemCount &nbsp;</i>条记录，当前显示第&nbsp;<i class="blue">@currentPageIndex &nbsp;</i>页
    </div>
    <div class="paginList" style="margin-top:-20px; font-size:smaller !important;">
        @Ajax.Pager(Model, new PagerOptions{PageIndexParameterName = "id",ContainerTagName = "ul",PrevPageText = "上页",NextPageText = "下页",FirstPageText = "首页",LastPageText = "尾页",CssClass = "pagination",PagerItemsSeperator = "",CurrentPagerItemWrapperFormatString = "<li class=\"active\"><a href=\"#\">{0}</a></li>",PagerItemWrapperFormatString = "<li>{0}</li>",NumericPagerItemCount = 5,AlwaysShowFirstLastPageNumber = true }, 
　　　　　　new MvcAjaxOptions{UpdateTargetId = "container",HttpMethod = "Post",DataFormId = "searchForm" }, new { style = "float:right" })
    </div>
</div>

 

解决方案：

分页插件设置属性：AutoHide=false

<div class="pagin">
    <div class="message">
        @{int totalItemCount = Model == null ? 20 : Model.TotalItemCount;}
        @{int currentPageIndex = Model == null ? 2 : Model.CurrentPageIndex;}
        共
        <i class="blue">@totalItemCount &nbsp;</i>条记录，当前显示第&nbsp;<i class="blue">@currentPageIndex &nbsp;</i>页
    </div>
    <div class="paginList" style="margin-top:-20px; font-size:smaller !important;">
        @Ajax.Pager(Model, new PagerOptions{PageIndexParameterName = "id",ContainerTagName = "ul",PrevPageText = "上页",NextPageText = "下页",FirstPageText = "首页",LastPageText = "尾页",CssClass = "pagination",PagerItemsSeperator = "",CurrentPagerItemWrapperFormatString = "<li class=\"active\"><a href=\"#\">{0}</a></li>",PagerItemWrapperFormatString = "<li>{0}</li>",NumericPagerItemCount = 5,AlwaysShowFirstLastPageNumber = true,AutoHide=false},
 　　　　new MvcAjaxOptions{UpdateTargetId = "container",HttpMethod = "Post",DataFormId = "searchForm" }, new { style = "float:right" })
    </div>
</div>

 

注：MvcPager3.0版本已解决：

附MvcPager 3.0 更新说明

• 修正了路由定义中对页索引参数使用约束而导致无法为页索引文本或下拉框生成跳链接的bug；
• 修正了Ajax分页模式下，如果首次加载时数据只有一页且未设置AutoHide=false，则控件不呈现任何有效html标签，导致MvcPager初始化失败以及后续Ajax分页功能失效的bug；
• 修正了Ajax分页模式下，同一PartialView中包含两个或更多MvcPager且PagerOptions.PageIndexParameterName属性值相同的情况下多次发送相同http请求的问题；
• MvcAjaxOptions新增EnableHistorySupport属性，用于Ajax分页时启用或禁用浏览器历史记录功能，默认值为true；
• MvcAjaxOptions新增AllowCache属性，用于Ajax分页时是否允许缓存（默认值为true，禁用缓存仅在GET提交时有效，详情参见jQuery文档）；
• PagerOptions新增DisabledPagerItemTemplate属性，用于设置被禁用的分页元素的html模板；
• PagerOptions新增OnPageIndexError属性，用于设置页索引出错时要调用的javascript函数，若未设置则默认用alert弹出错误信息；
• PagerOptions新增HidePagerItems属性，用于设置是否隐藏所有分页元素，开发者可通过客户端Javascript API自己创建分页元素并用goToPage()方法实现分页跳转；
• PagerOptions新增ActionName、ControllerName、 RouteName、RouteValues和HtmlAttributes属性，即将原HtmlHelper.Pager及 AjaxHelper.Pager扩展方法中的actionName，controllerName，routeName，routeValues及 htmlAttributes参数并入PagerOptions属性中，相应调整了HtmlHelper.Pager和AjaxHelper.Pager 扩展方法重载；
• PagerOptions的属性 PagerItemWrapperFormatString，NumericPagerItemWrapperFormatString，CurrentPagerItemWrapperFormatString，NavigationPagerItemWrapperFormatString，MorePagerItemWrapperFormatString， 分别改名为 PagerItemTemplate，NumericPagerItemTemplate，CurrentPagerItemTemplate，NavigationPagerItemTemplate，MorePagerItemTemplate
• PagerOptions.MaxPageIndex属性更名为PagerOptions.MaximumPageNumber；
• 去除PagerOptions的属性PageIndexBoxWrapperFormatString，GoToPageSectionWrapperFormatString；
• 去除PagerOptions中页索引框的相关属性ShowPageIndexBox、 ShowGoButton、PageIndexBoxType和GoButtonText，新增PageIndexBoxId和GoToButtonId 属性，用于指定页索引框和跳转按钮；
• 去除PagerOptions.PagerItemsSeperator属性，分页按钮之间若需使用空格分隔可以用PagerOptions.PagerItemTemplate=" {0} "模板来实现；
• PagedList.StartRecordIndex 重命名为 PagedList.StartItemIndex;
• PagedList.EndRecordIndex 重命名为 PagedList.EndItemIndex;
• 被禁用的分页按钮不再使用超链接（<a disabled="disabled"></a>）；
• HtmlHelper.Pager新增Options方法，AjaxHelper.Pager新增Options和AjaxOptions方法；
• 新增HtmlHelper.LoadMvcPagerScript方法，用于动态加载MvcPager的客户端脚本库（用该方法注册的脚本必须包含在<script>与</script>标签内），支持通过Ajax加载和初始化MvcPager；
• 对MvcPager客户端jQuery插件进行重构，添加新功能并做了大量代码优化和完善；
• 同时支持简体中文、繁体中文和英文等多种语言，不再单独发布中文版和英文版；
• 新增客户端Javascript API，用于获取分页控件属性及跳转到指定页；
• 添加更多示例项目，覆盖MvcPager所有功能；
• 重新制作的全新的在线帮助文档；
• 添加更多服务器端及客户端Javascript单元测试；
• 仅支持ASP.NET MVC 4.0及更高版本；

升级说明：

从MvcPager 2.0升级到3.0时，需注意以下事项：

1. PagerOptions的属性 PagerItemWrapperFormatString，NumericPagerItemWrapperFormatString，CurrentPagerItemWrapperFormatString，NavigationPagerItemWrapperFormatString，MorePagerItemWrapperFormatString， 分别改名为 PagerItemTemplate，NumericPagerItemTemplate，CurrentPagerItemTemplate，NavigationPagerItemTemplate，MorePagerItemTemplate；
2. PagerOptions.MaxPageIndex属性改名为PagerOptions.MaximumPageNumber；
3. Pager()方法中原actionName、controllerName、routeName、routeValues和htmlAttributes等参数被并入PagerOptions属性中，设置时请设置PagerOptions属性；
4. Html.Pager()扩展方法重载从原来十个减为四个，升级时请注意使用合适的重载方法；
5. Ajax.Pager()扩展方法重载从原来十个减为四个，升级时请注意使用合适的重载方法；
6. PagerOptions中页索引框的相关属性ShowPageIndexBox、ShowGoButton、 PageIndexBoxType和GoButtonText已被去除，启用页索引框时请使用PagerOptions.PageIndexBoxId和 PagerOptions.GoToButtonId属性；
7. 被禁用的分页按钮不再使用超链接，若需使用，请通过新增的PagerOptions.DisabledPagerItemTemplate属性来设置；
8. PagerOptions.MaxPageIndex属性更名为PagerOptions.MaximumPageNumber；
9. PagerOptions.PagerItemsSeperator属性已去除，分页按钮之间若需使用空格分隔可以用PagerOptions.PagerItemTemplate="&nbsp;{0}&nbsp;"模板来实现；
10. 支持多语言，默认为英文，若需使用简体中文版，请在网站根目录的web.config中system.web配置节下添加如下设置：globalization culture="zh-CN" uiCulture="zh-CN"

运行最低需求：

1. jQuery 1.7及以上版本；（启用页索引输入或选择框、调用Javascript API或使用Ajax分页模式时必需）
2. ASP.NET MVC 4.0及以上版本；

3.0版已知问题：

1. Ajax分页模式下，如果用于返回数据的PartialView中包含多个MvcPager且 PagerOptions.PageIndexParameterName属性值相同时，只有第一个MvcPager会发起Ajax请求且触发Ajax事 件，其后的MvcPager将不再发起请求，因此OnSuccess、OnComplete和OnFailure等ajax事件不会被触发，对应的页索引 输入或选择框在分页后也无法绑定事件及填充页索引；
2. Ajax分页模式下浏览器历史记录支持功能暂不支持IE7以下及Opera浏览器；
3. Url中值为空的参数在分页后将被从Url中去除；如：/articles/show/2?cls=news&type= 在分页后type参数将丢失，Url变为：/articles/show/3?cls=news
4. 为AjaxForm使用Ajax分页查询功能时，web.config中的UnobtrusiveJavaScriptEnabled必须设为true（默认），否则会导致分页时数据被加载两次；