Bootstrap paginator分页控件实例
作者:互联网
1 <!--分页插件,需额外引用jquery--> 2 <script src="/Scripts/bootstrap/js/bootstrap-paginator.min.js"></script> 3 4 <script type="text/javascript"> 5 6 7 $(function () { 8 getDataList(1); 9 }); 10 11 12 /** 13 * 14 * @param pageCurrent 当前所在页 15 * @param pageSum 总页数 16 * @param callback 调用ajax 17 */ 18 function setPage(pageCurrent, pageSum, callback) { 19 20 $(".pagination").bootstrapPaginator({ 21 //设置版本号 22 bootstrapMajorVersion: 3, 23 // 显示第几页 24 currentPage: pageCurrent, 25 // 总页数 26 totalPages: pageSum, 27 //当单击操作按钮的时候, 执行该函数, 调用ajax渲染页面 28 onPageClicked: function (event, originalEvent, type, page) { 29 // 把当前点击的页码赋值给currentPage, 调用ajax,渲染页面 30 currentPage = page; 31 32 getDataList(page); 33 34 callback && callback(); 35 } 36 }) 37 } 38 39 function getDataList(page){ 40 41 $.ajax({ 42 type: "post", 43 url: "test.ashx", 44 dataType: "json", 45 //async:true, 46 data: { 47 pageIndex: page,//页数 48 pageCount: 10,//每页显示的数量 49 }, 50 success: function (data) { 51 if (data.IsSucess) { 52 //toTR自己写的方法用于将数据列表转为tr列表、 53 $("#tbRemind").html(toTR(data.Datas)); 54 55 setPage(data.Remark.Page, data.Remark.Sum / (data.Remark.Page * 10)); 56 } 57 else { 58 alert(data.Message); 59 } 60 }, 61 error: function (XMLHttpRequest, textStatus, errorThrown) { 62 //alert(XMLHttpRequest.status); 63 //alert(XMLHttpRequest.readyState); 64 //alert(textStatus); 65 }, 66 }); 67 } 68 </script>
标签:paginator,控件,function,Bootstrap,alert,callback,ajax,data,page 来源: https://www.cnblogs.com/King-JJ/p/14543553.html