杨涛主页
Fork me on GitHub

 在线演示

 帮助文档

 源 代 码

MvcPager 分页示例 — 页索引错误处理

本示例演示如何自定义页索引错误处理。

请在下面示例的页索引输入框中输入小于1或大于6的数，或清空页索引输入框后点击跳转按钮查看效果：

默认模式（未设置PagerOptions.OnPageIndexError属性）：
首页 上页 1 2 3 4 5 6 下页 尾页 
调用Javascript内置函数：
PagerOptions.OnPageIndexError="alert('错误类型：'+errType+'，错误信息：'+errMsg)"
首页 上页 1 2 3 4 5 6 下页 尾页 
调用自定义函数，弹出Bootstrap Modal显示错误信息：
    PagerOptions.OnPageIndexError="handleError"

    <script type="text/javascript">
    function handleError(etype, eMsg) {
        $("#errMsg").html("当前页索引：" + this.currentPageIndex + "，总页数：" + this.pageCount + "<br/>错误类型：" + etype + "，错误信息：" + eMsg);
        $('#msgModal').modal();
    }
    </script>
首页 上页 1 2 3 4 5 6 下页 尾页 

View：

@model PagedList<string>
<style type="text/css">
    .pibarea {float: left;margin-left: 2em;}
    .pagerdiv {width: 100%;overflow: auto;}
</style>
<div class="pagerdiv">
            <h6><strong>默认模式（未设置PagerOptions.OnPageIndexError属性）：</strong></h6>
    @Html.Pager(Model).Options(o => o.SetId("pager3").SetPageIndexParameterName("id").SetPageIndexBoxId("pib1").SetGoToButtonId("gtb1").AddHtmlAttribute("style", "float:left").SetPagerItemTemplate("{0}&nbsp;"))
            <div class="pibarea">
            <input type="text" id="pib1" style="width:58px" /><button id="gtb1">跳转</button>
    </div>
</div>
<hr />
<div class="pagerdiv">
            <h6><strong>调用Javascript内置函数（PagerOptions.OnPageIndexError="alert('错误类型：'+errType+'，错误信息：'+errMsg)"）：</strong></h6>
    @Html.Pager(Model).Options(o => o.SetPageIndexParameterName("id").SetPageIndexBoxId("pib2").SetGoToButtonId("gtb2").AddHtmlAttribute("style", "float:left").SetPagerItemTemplate("{0}&nbsp;").SetOnPageIndexError("alert('错误类型：'+errType+'，错误信息：'+errMsg)"))
            <div class="pibarea">
            <input type="text" id="pib2" style="width:58px" /><button id="gtb2">跳转</button>
    </div>
</div>
<hr />
<div class="pagerdiv">
            <h6><strong>调用自定义函数（PagerOptions.OnPageIndexError="handleError"）：</strong></h6>
    @Html.Pager(Model).Options(o => o.SetPageIndexParameterName("id").SetPageIndexBoxId("pib3").SetGoToButtonId("gtb3").AddHtmlAttribute("style", "float:left").SetPagerItemTemplate("{0}&nbsp;").SetOnPageIndexError("handleError"))
            <div class="pibarea">
            <input type="text" id="pib3" style="width:58px" /><button id="gtb3">跳转</button>
    </div>
</div>
<div class="modal fade" id="msgModal">
            <div class="modal-dialog modal-sm">
            <div class="modal-content">
            <div class="modal-header">
            <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
            <h4 class="modal-title">出错啦！</h4>
            </div>
            <div class="modal-body text-danger" id="errMsg">
            </div>
            <div class="modal-footer">
            <button type="button" class="btn btn-default" data-dismiss="modal">确定</button>
            </div>
        </div>
    </div>
</div>
@section Scripts{@{Html.RegisterMvcPagerScriptResource();}
    <script type="text/javascript">
    function handleError(etype, eMsg) {
        $("#errMsg").html("当前页索引：" + this.currentPageIndex + "，总页数：" + this.pageCount + "<br/>错误类型：" + etype + "，错误信息：" + eMsg);
        $('#msgModal').modal();
    }
    </script>
}

Controller：

        public ActionResult PageIndexError(int id = 1)
        {
            return View(new PagedList<string>(new string[0], id, 1, 6));
        }