bootstrap分页的使用

var totalCount = "";
//这块table表单业务,可忽略
function getInsAppoint(){ $.ajax({ type: "post", data : JSON.stringify({ 'offset':'0', 'limit':'6', 'instrumentName':$("#text").val() }), contentType:"application/json", dataType: 'json', url: '/jk/pb/instrumentInfo/appointList', async : false, success:function(data){ var obj = eval(data); var list = obj.rows; totalCount = obj.total; $("#totalCount").text(totalCount); initialize(list); pageLimit(totalCount,1);//数据回显时第一页显示的数据 } }); } function pageLimit(totalCount,currentPage){ var totalPage = 0;//列表的总页数 var pageSize = 6;//每页显示6条数据 if (totalCount/pageSize > parseInt(totalCount/pageSize)){ totalPage = parseInt(totalCount/pageSize)+1; }else{ totalPage = parseInt(totalCount/pageSize); } $('.pagination').bootstrapPaginator({//将id为pageLimit的ul元素设置为分页插件 currentPage: currentPage,//设置当前页码 size: "small",//设置控件的显示大小, bootstrapMajorVersion: 3,//当前版本 alignment: "right",//设置控件的对齐方式 totalPages: totalPage,//设置总页数. itemTexts: function (type, page, current) {//控制每个操作按钮的显示文字。是个函数,有3个参数: type, page, current。 //通过这个参数我们就可以将操作按钮上的英文改为中文,如first-->首页,last-->尾页。 switch (type) { case "first": return "首页"; case "prev": return "<"; case "next": return ">"; case "last": return "末页"; case "page": return page; } }, onPageClicked: function (event, originalEvent, type, page) {//为操作按钮绑定click事件。 //回调函数的参数:event, originalEvent, type,page。 $.ajax({ async: true, url: "/jk/pb/instrumentInfo/appointList", type: "post", contentType:"application/json", dataType : "json", data: JSON.stringify({ 'offset':(page-1)*6, 'limit':'6', 'instrumentName':$("#text").val() }), cache: false, success: function (data) { var obj = eval(data); var list = obj.rows; totalCount = obj.total; initialize(list); pageLimit(totalCount,page); } }); } }); }

业务

function initialize(list) {
        var str = "";
        for (var i = 0; i < list.length; i++) {
            var applyStatus = list[i].entryApplyStatus;
            var applyTime = "";
            var uploaded = "";
            var imageUrl = list[i].imageUrl;
            if (imageUrl == null || imageUrl.length != 0){
                imageUrl = "<img src='/img/instrument.png'>";
            } else {
                imageUrl = "<img src='"+ list[i].imageUrl +"'>";
            }
            if (applyStatus == "1"){
                uploaded = "<button type='button' class='btn btn-link'>审核中</button>"
            } else if(applyStatus == "2"){
                applyTime = "<a onClick='makeApply("+list[i].instrumentId+")'>机时</a>"
                uploaded = "<button type='button' class='btn btn-link'>已上传</button>"
            } else if(applyStatus == "3"){
                uploaded = "<button type='button' class='btn btn-link' onClick='entryApply("+list[i].instrumentId+")'>被驳回</button>"
            } else {
                uploaded = "<button type='button' class='btn btn-link' onClick='entryApply("+list[i].instrumentId+")'>未上传</button>"
            }
            str += "<div class='col-md-4'>"
                    + "<div class='item'>"
                    + imageUrl
                    + "<div class='item-title inline'>"
                    + "<h4 class='inline'>"+ list[i].instrumentName+"</h4>"
                    + "</div>"
                    + "<div class='item-subtitle inline'>"
                    + "<img src='/img/timg.jpg'>"
                    + applyTime
                    /*+ " <a href='###'>送样</a>"*/
                    + "</div><p>"+ list[i].useIrection+"</p>"
                    + "<div class='item-footer'>"
                    + "<button type='button' class='btn btn-link'>评论(10)</button>"
                    + "<div class='upload inline'>"
                    + "<img src='/img/upload.png'>"
                    + uploaded
                    + "</div></div></div></div>";
        }
        $("#instrumentInfoAppoint").html(str);
    }

猜你喜欢

转载自www.cnblogs.com/person008/p/11926464.html