springMVC实现ajax分页

2016-12-13 19:29:22来源:CSDN作者:peter_qyq人点击

服务端代码

	/**	 * 付费问题详情	 * 	 * @return	 */	@RequestMapping(value = "/questionPay/{id}.html", produces = "text/html;charset=UTF-8")	public String questionPay(@PathVariable Long id, ModelMap model, HttpServletRequest request) {		try {			QidaQuestion question = qidaQuestionService.get(id);			question.setPageViews((question.getPageViews() == null ? 0 : question.getPageViews()) + 1);			qidaQuestionService.save(question);			model.put("question", question);			model.put("nowDate", new Date());			FuUser fuUser = (FuUser) request.getSession().getAttribute("fuUser");			model.put("fuUser", fuUser);			if (fuUser != null) {				// 用户关注				List<QidaConcern> concernList = qidaConcernService.findByMySelf(fuUser.getId());				model.put("concernList", concernList);				// 用户收藏				List<QidaCollection> collectionList = qidaCollectionService.findByMySelf(fuUser.getId());				model.put("collectionList", collectionList);				// 是否关注				int res = qidaConcernService.findIsWatch(fuUser, question.getFuUser());				model.put("res", res);				// 是否收藏				QidaCollection collection = qidaCollectionService.findByQuestion(fuUser.getId(), id);				if (collection == null) {					model.put("isCollection", 0);				} else {					model.put("isCollection", 1);				}			}			Map<String, Object> map = new HashMap<String, Object>();			map.put("qidaRank", "专家");			Integer totalCount = fuUserService.getCount(map);			model.put("totalCount", totalCount);		} catch (Exception e) {			e.printStackTrace();		}		return "qida/questionDetail/questionPay";	}	/**	 * 分页查询专家列表	 * 	 * @return	 */	@RequestMapping(value = "/questionExpert.html", produces = "text/html;charset=UTF-8")	@ResponseBody	public String questionExpert(Integer pageNo, Integer pageSize, ModelMap model) {		JSONObject json = new JSONObject();		try {			Map<String, Object> map = new HashMap<String, Object>();			map.put("qidaRank", "专家");			List<FuUser> expertList = fuUserService.findList((pageNo - 1) * pageSize, pageSize, map);			JSONArray array = new JSONArray();			if (expertList != null && expertList.size() > 0) {				for (FuUser user : expertList) {					JSONObject obj = new JSONObject();					obj.put("id", user.getId());					obj.put("userAvatar", user.getUserAvatar() == null ? "../../images_qiDa/tx.png" : user.getUserAvatar());					obj.put("nickName", user.getNickName() == null ? "佚名" : user.getNickName());					array.add(obj);				}				json.put("array", array);			}		} catch (Exception e) {			e.printStackTrace();		}		return json.toString();	}	/**	 * 邀请专家解答付费问题	 */	@RequestMapping(value = "/InvitationAnswer/{expertId}/{questionId}.html", produces = "text/html;charset=UTF-8")	@ResponseBody	public String InvitationAnswer(@PathVariable Long expertId, @PathVariable Long questionId) {		try {			QidaQuestion question = qidaQuestionService.get(questionId);			question.setAnswerUser(fuUserService.get(expertId));			qidaQuestionService.save(question);		} catch (Exception e) {			e.printStackTrace();		}		return null;	}


前端代码

html代码

<div class="discussBtnBod">	<c:if test="${fuUser.id==question.fuUser.id}">	<a class="invite"><i class="inviteImg"></i>邀请专家<input class="inviteHid" type="hidden" value="0"/></a>	</c:if></div><div class="zjList">	<div class="zjInfo">您已邀请${empty question.answerUser?'':question.answerUser.nickName==null?'佚名':question.answerUser.nickName}</div>	<ul class="zjList-ul">	</ul>	<nav class="fenye">	<ul class="pager">		<li><a href="javascript:void(0)" onclick="lastPage()">上一页</a></li>		<li><a href="javascript:void(0)" onclick="nextPage()">下一页</a></li>	</ul>	</nav></div>

js代码

        var totalCount=${totalCount};		var pageNo=1;		var pageSize=4;		var totalPage=(totalCount%pageSize==0)?totalCount/pageSize:totalCount/pageSize+1;		searchExpert(pageNo,pageSize);				//分页查询邀请的专家		function searchExpert(pageNo,pageSize){			$.post("${ctx}/web/qida/questionExpert.html",{pageNo:pageNo,pageSize:pageSize},function(data){				var data=eval("("+data+")");				$(".zjList-ul").find("li").remove(); 				var length=data.array.length;				var result = '';				for(var i=0;i<length;i++){					var arrText = [];					arrText.push("<li><div class='tx'><a class='txImg'><img src='"+data.array[i].userAvatar+"' /></a></div>");					arrText.push("<div class='zjList-infos'><div class='zjList-inf userNm grayCol'><span class='smalBlu'>"+array[i].nickName+"</span><br></div>");					if(${question.answerUser==null}){					      arrText.push("<a class='zjList-btn' onclick='InvitationAnswer("+data.array[i].id+",${question.id})'>邀请回答</a>");					}					if(data.array[i].id==${question.answerUser==null?0:question.answerUser.id}){                                arrText.push("<a class='zjList-btnac'>已邀请</a>");                         }					arrText.push("</div></li>");					result +=  arrText.join('');				}				$(".zjList-ul").append(result);			})		}				//上一页		function lastPage(){			pageNo -= 1;			pageNo=pageNo>=0?pageNo:0;			searchExpert(pageNo,pageSize);		}				//下一页		function nextPage(){			if(pageNo+1<=totalPage){				pageNo += 1;			}			searchExpert(pageNo,pageSize);		}				//邀请专家解答		function InvitationAnswer(expertId,questionId){			$.post("${ctx}/web/qida/InvitationAnswer/"+expertId+"/"+questionId+".html",null,function(){				layer.open({	 			    content: "邀请成功!",	 			    btn: ["确定"],	 			    shadeClose: false,	 			    yes: function(){	 			        layer.closeAll();	 			        location.href=location.href;	 			    } 				});			})		}

效果图


最新文章

123

最新摄影

微信扫一扫

第七城市微信公众平台