模态框分页java代码_AJAX 和SpringMVC 实现bootstrap模态框的分页查询功能详解

本文主要介绍了AJAX +SpringMVC 实现bootstrap模态框的分页查询功能，以及模态框 ajax分页实例代码分享，非常不错，具有参考借鉴价值，需要的朋友可以参考下，希望能帮助到大家。

一 、效果图

二、JS

function getManagerList(dealerId,page2){

macAddress = document.getElementById("activeXDemo").getMac();

$.get("${ctxPath}/common/dealer/manager?"+Math.random(), {

page2: page2,

pageSize2: 9,

dealerId: dealerId,

macAddress:macAddress

},

function(data){

if(data){

var managerList=data.managerList;

var uploadDir=data.uploadDir;

var rs = "";

for (var i=0;i

" rs="rs+"

"+name+"

";

}

$('#managerList').empty();

$('#managerList').append(rs);

var page2=data.page2;

var stor_no2=data.stor_no2;

var pageCount2=data.pageCount2;

var pagination = "";

pagination+="

三、模态框

×Close

经营人员

四、controller

@RequestMapping(value = "manager", method =RequestMethod.GET)

public @ResponseBody ModelAndView queryManager(Model model

, @RequestParam(defaultValue = "0")int page2

, @RequestParam(defaultValue = "9")int pageSize2

, @RequestParam(required = false, defaultValue = "")String dealerId

, String macAddress){

FastJsonJsonView view = new FastJsonJsonView();

if(macAddService.checkMacAddress(macAddress, "E")==true){

String uploadDir = this.localUploadTools.getPreviewDir() + "/dealerUpload";

PaginationSupport managerVOPS = dealerService.queryManager(dealerId, page2, pageSize2);

view.addStaticAttribute("page2", page2);

view.addStaticAttribute("uploadDir", uploadDir);

view.addStaticAttribute("managerList", managerVOPS.getObject());

view.addStaticAttribute("stor_no2", managerVOPS.getTotalCount());

view.addStaticAttribute("pageCount2", managerVOPS.getPageCount());

}

return new ModelAndView(view);

}

好了，下面给大家介绍了bootstrap模态框 ajax分页实例代码，先给大家展示下效果图：

效果图：

上干货：

/**

* ajax分页

*/

$(function(){

$(".modal-body").find(".pagination").on("click","li",function(){

var totalPage=$(".modal-body").find(".pagination").find(".lilength").length;

var pageNo=$(this).find("a").text();

var beforePage="";

//获取之前选中的值

$(".modal-body").find(".pagination").find("li").each(function(){

if($(this).hasClass("active")){

beforePage=$(this).find("a").text();

}

});

//alert(beforePage);

if($(this).find("a").text()=="首页"){

removeClass();

$(".modal-body").find(".pagination").find("li").each(function(){

if($(this).find("a").text()=="1"){

$(this).addClass("active");

}

getPlanFy("1");

});

}else if($(this).find("a").text()=="上页"){

if(beforePage==1){

showMessage("已经是第一页了!")

}else{

var dqy=parseInt(beforePage)-1;

$(".modal-body").find(".pagination").find("li").each(function(){

if($(this).find("a").text()==dqy.toString()){

$(this).addClass("active");

}else{

$(this).removeClass("active");

}

});

getPlanFy(dqy);

}

}else if($(this).find("a").text()=="下页"){

if(beforePage==totalPage){

showMessage("已经是最后一页了!")

}else{

var dqy=parseInt(beforePage)+1;

$(".modal-body").find(".pagination").find("li").each(function(){

if($(this).find("a").text()==dqy.toString()){

$(this).addClass("active");

}else{

$(this).removeClass("active");

}

});

getPlanFy(dqy);

}

}else if($(this).find("a").text()=="末页"){

removeClass();

$(".modal-body").find(".pagination").find("li").each(function(){

if($(this).find("a").text()==totalPage){

$(this).addClass("active");

}

});

getPlanFy(totalPage);

}else{

removeClass();

$(this).addClass("active");

getPlanFy(pageNo);

}

});

// $(".table").find("tbody").on("click",".showMsgDetail",function(){

// var msg=$(this).find("a").attr("name");

// showMagDetail(msg);

// });

$(".addbutton").click(function(){

$("#savePlanmodal").removeAttr("name");

$("#planIdsUpdate").val("");

});

});

/**

* 弹窗

*/

function showMessage(content){

$.alert({

title: '提示',

content: content,//支持html

icon: 'fa fa-rocket',

animation: 'zoom',

closeAnimation: 'zoom',

buttons: {

okay: {

text: '确定',

btnClass: 'btn-primary'

}

}

});

}

/**

* 移除css

*/

function removeClass(){

$(".modal-body").find(".pagination").find("li").each(function(){

$(this).removeClass("active");

});

}

function getPlanFy(pageNo){

var pageSize=10;

$.post(""+otherPath+"/fault-studio/getInpectPlanList.action",

{"pageNo":pageNo,"pageSize":pageSize},function(data){

$("#inspectionPlan").find(".modal-body").find("table").find("tbody").html("");

$("#inspectionPlan").find(".modal-body").find(".pagination").html("");

var appendHtml="";

if(data.items!=null && data.items.length>0){

$.each(data.items,function(i,item){

var number=parseInt(i)+1;

appendHtml+="

" +

""+number+"" +

""+item[2]+""+

""+item[3]+""+

""

});

$("#inspectionPlan").find(".modal-body").find("table").find("tbody").append(appendHtml);

var paginHtml="";

if(isNotTirmpagin(data.totalPage) && data.totalPage>0){

paginHtml+="