springmvc+mybaits pagination Processing +ajax page flipping

Springmvc+mybaits

(Pagination processing +ajax page)

(2)/**

* Show Micro-mall template

*/

@RequestMapping (value= "/SCMB", method = Requestmethod. GET)

Public Modelandview Showmodel (Modelandview mv, HttpServletRequest Request,integer p, Integer k) {

if (p = = null) {

p = 0;

}

if (k = = null) {

K = 10;

}

Gson Gson = new Gson ();

Page<weixinmalllist> Page=weixinmailservice.querypageshowweimallmodel (P, k);

String Listjson = Gson.tojson (Page.getcontent ());

Mv.addobject ("Listjson", Listjson);

Mv.addobject ("page", page);

Mv.addobject ("P", p);

Mv.setviewname ("/admin/weimall/showmoban");

return MV;

}

/**

* Ajax jumps When you click the previous page next page

*/

@RequestMapping (value= "/listajax", method = Requestmethod. GET)

@ResponseBody

Public Page<weixinmalllist> Listajax (Modelandview mv, HttpServletRequest Request,integer p, Integer k) {

if (p = = null) {

p = 0;

}

if (k = = null) {

K = 10;

}

Page<weixinmalllist> Page=weixinmailservice.querypageshowweimallmodel (P, k);

return page;

}

Required (1) <link rel= "stylesheet" href= "${ctx}/bootstrap/css/bootstrap.min.css" >

<link rel= "stylesheet" href= "${ctx}/bootstrap/css/font-awesome.min.css" >

<link rel= "stylesheet" href= "${ctx}/bootstrap/css/ionicons.min.css" >

<script src= "${ctx}/bootstrap/js/bootstrap.min.js" ></script>

<script src= "${ctx}/plugins/datetimepicker/js/bootstrap-datetimepicker.js" ></script>

<script src= "${ctx}/plugins/datetimepicker/js/locales/bootstrap-datetimepicker.zh-cn.js" ></script>

<script src= "${ctx}/js/jquery.bootpag.js" ></script>

(Serves layer)

/**

* Templates for displaying the mall

* @return

*/

Public Page<weixinmalllist> Querypageshowweimallmodel (integer p, integer k) {

Pagerequest pageable = new pagerequest (P, k);

List<weixinmalllist> List=mallmapper.querypagemalllistmoban (pageable);

page<weixinmalllist> page =new pageimpl<weixinmalllist> (list, new pagerequest (P, K), Pageable.getpagenumber ());

return page;

}

(Mapper layer)

Query Template Information

List<weixinmalllist> Querypagemalllistmoban (@Param ("pageable") pageable pageable);

SP Page js

Pagination processing

$ (function() {

$ (' #pagination '). Bootpag ({

Total: ' ${page.totalpages} ',//How many pages

Page: ' ${page.number + 1} ',//The number of pages currently displayed, the component starting from 1

Maxvisible:10,//number of pages visible

Firstlastuse: True,

First: ' Home ',

Last: ' End ',

Wrapclass: ' Pagination ',

Activeclass: ' Active ',

Disabledclass: ' Disabled ',

Nextclass: ' Next ',

Prevclass: ' prev ',

Lastclass: ' Last ',

FirstClass: ' First '

}). On ("page", function(event, num) {////The number of pages you clicked on the page, starting from 1

$ ("#p"). Val (num-1);

Shuax ();

});

});

$.ajax//////////for pagination processing

function Shuax () {

$.ajax ({

Type: "Get",

URL: "${ctx}/admin/listajax?p=" + $ (' #p '). Val (),

Success: function(data) {

var pas = data["content"];

json = pas;

var th = "";

for (var i = 0; i < pas.length; i++) {

var pa = pas[i];

th = th + ' <tr><td> ' + (i+1) + ' </td> ' +

' <td> ' +pa[' name ']+ ' </td> ' +

' <td></td> ' +

' <td> ' +pa["money"]+ ' </td> ' +

' <td> ' +pa["Oldmoney"]+ ' </td> ';

if (pa["Miao"].length >20) {

th = th + ' <td> ' +pa["Miao"].substring (0,10) + ' ... ' + ' </td> ';

}Else{

th = th + ' <td> ' +pa["Miao"]+ ' </td> ';

}

th=th+ ' <td><button type= "button" class= "btn btn-success btn-sm" ' + ' onclick= "javascript: window.location.href= ' + ' ${ctx}/admin/updatemobans?id= ' +pa[' id ']+ ' ' + ' ' + ' title= ' modify ' ><span class= ' Glyphicon glyphicon-upload "></span></button>" +

' <button type= ' button "class=" btn btn-default btn-sm "' +

' title= ' delete ' + '

' onclick= ' javascript:window.location.href= ' + ' ${ctx}/admin/deletemobans?id= ' +pa["id"]+ "'" + ' "' + ' > ' +

' <span class= ' Glyphicon glyphicon-trash ' ></span></button></td> ';

}

$ (' #b '). html (TH);

var ye = data["totalpages"];

if (Ye = = 0) ye = 1;

var xian = data["number"] + 1;

$ (' #pagination '). Bootpag ({

Total:ye,//How many pages

Page:xian

The number of pages currently displayed, starting from 1

});

}

})

}

<input type = "hidden" id = "p" value = "${p}">

Paging Plugin

<div class="Clearfix text-right">

<div class="Box-tools">

<div id="pagination" style= "margin-top: 10px;" ></div>

</div>

</div>

springmvc+mybaits pagination Processing +ajax page flipping