jquery分页

1、引入pagination

2、

var page = 0;
var length = 0;
var querydata = {};

$("#query").on("click", function () {
     querydata = {};
     querydata.name = $("#name").val();
     $.ajax({
          url:"http://127.0.0.1:8081/hz-ssm/user/query",
          type:"post",
          data:querydata,
          dataType:"json",
          success:function(data){
              length = data.length;
              alert(length);
              querydata.page = 0;
               $.ajax({
                   url:"http://127.0.0.1:8081/hz-ssm/user/query",
                   type:"post",
                   data:querydata,
                   dataType:"json",
                   success:function(data){
                       var userTable = $("#userTable");
                       userTable.empty();
                       for(var i=0;i<data.length;i++){
                          userTable.append("<tr><td>"+(data[i].id+1)+"</td><td>"+data[i].name+"</td><td>"+data[i].loginId+
                              "</td><td>"+data[i].sex+"</td><td>"+data[i].age+"</td><td>"+
                              new Date(data[i].registerTime).Format("yyyy-MM-dd hh:mm:ss")+
                              "</td><td>"+data[i].roleName+"</td><td><button class='edit btn btn-primary' value='"+
                              data[i].id+"'>编辑</button></td></tr>");
                       }
                       $("#pagination").pagination(length,{  //length为记录总数
                           num_edge_entries: 2,  //两侧显示的首尾分页的条目数
                           num_display_entries: 3,//连续分页主体部分显示的分页条目数
                           current_page: 0,//当前选中的页面 可选参数
                           callback: pageCallBack,//翻页回调函数
                           items_per_page:5,//每页多少条
                           prev_text: '上一页',
                           next_text: '下一页',
                           prev_show_always: true,//是否显示“前一页”分页按钮
                           next_show_always: true//是否显示“下一页”分页按钮
                      });
                  }
               });
            }
        })
  });




function pageCallBack(pageindex, jq){
    querydata.page = pageindex;
    $.ajax({
        url:"http://127.0.0.1:8081/hz-ssm/user/query",
        type:"post",
        data:querydata,
        dataType:"json",
        success:function(data){
            var userTable = $("#userTable");
            userTable.empty();
            for(var i=0;i<data.length;i++){
                userTable.append("<tr><td>"+(data[i].id+1)+"</td><td>"+data[i].name+"</td><td>"+data[i].loginId+
                  "</td><td>"+data[i].sex+"</td><td>"+data[i].age+"</td><td>"+
                  new Date(data[i].registerTime).Format("yyyy-MM-dd hh:mm:ss")+
                  "</td><td>"+data[i].roleName+"</td><td><button class='edit btn btn-primary' value='"+
                  data[i].id+"'>编辑</button></td></tr>");
            }
        }
     })
}

猜你喜欢

转载自blog.csdn.net/qq_39150192/article/details/82633206
今日推荐