以隨便一個類爲例子:這個例子是查詢企業主營類別前5事項javascript
1、以json數組的格式返回到前端中html
(1)後端將結果綁定到param中,而後將結果覺得json數組的格式返回到前端前端
/** * 查詢企業主營類別前5事項 * @param request * @param response * @param config * @throws Exception * @author hongxy * 2017年6月1日下午2:21:14 */ public void getEnterpriseMainCategory(HttpServletRequest request, HttpServletResponse response, ServletConfig config) throws Exception { request.setCharacterEncoding("UTF-8"); response.setCharacterEncoding("UTF-8"); response.setContentType("text/html;charset=UTF-8"); Map param = new HashMap(); PrintWriter wirte = null; //得到企業名稱 String custName = RequestUtil.getString(request, "companyName"); //判斷企業名稱是否爲空 if (StringUtils.isBlank(custName)) { param.put("status", "400"); param.put("desc", "企業名稱爲空!"); } else { workService = new WorkServiceImpl(); //查詢是否存在該企業 Map enterpriseInfo = workService.getEnterpriseInfoByCustName(custName); //不存在該企業 if (enterpriseInfo == null) { param.put("status", "400"); param.put("desc", "企業名稱不存在!"); } else {//存在該企業,查詢企業主營類別前5事項 //根據企業名稱查詢出該企業近一年的已辦事項 String approveTypeList = workService.getEnterpriseWorksInfoByCustName(custName); //根據行業類別查詢企業名稱 String custNameListByIndustry = workService.getEnterpriseNameByIndustry((String) enterpriseInfo.get("INDUSTRY")); //查詢企業主營類別前5事項 List mainProjectList = workService.getApproveInfoList(custNameListByIndustry,approveTypeList); param.put("status", "200"); param.put("desc", "處理成功"); param.put("data", mainProjectList); } } //聲明JSONArray對象並輸入JSON字符串 JSONArray array = JSONArray.fromObject(param); wirte = response.getWriter(); wirte.print(array); }
(2)前端先將接受到的數據轉換成json格式,否則就不能獲取裏面的值了,由於Ajax返回的值默認是字符串類型java
將接收到的值轉換成json格式的核心代碼:(具體的取值能夠輸出到前端控制檯,這樣方便取值)ajax
var msg=jQuery.parseJSON(msg);
$.ajax({ url: '${path.appMain}?service=work&func=getEnterpriseMainCategory', async: false, type: 'POST', data: { companyName:companyName }, success: function(msg){ var msg=jQuery.parseJSON(msg); var mainProjectList = ""; mainProjectList +="<li>與您的「主營項目類別」相同的企業,辦理最多的事項有:</li>" for (var i = 0; i < msg[0].data.length; i++) { mainProjectList += "<li><a href='javascript:void(0);'>"+ (i+1) + "." + msg[0].data[i].approveName + "</a></li>"; } $('#mainProjectList').html(mainProjectList); } });
2、以json的格式返回到前端中(經常使用)json
(1)後端將結果綁定到data中,而後將結果覺得json的格式返回到前端後端
/** * 查詢企業主營類別前5事項 * @param request * @param response * @param config * @throws Exception * @author hongxy * 2017年6月1日下午2:21:14 */ public void getEnterpriseMainCategory(HttpServletRequest request, HttpServletResponse response, ServletConfig config) throws Exception { request.setCharacterEncoding("UTF-8"); JSONObject json = new JSONObject(); Map param = new HashMap(); //得到企業名稱 String custName = RequestUtil.getString(request, "companyName"); //判斷企業名稱是否爲空 if (StringUtils.isBlank(custName)) { json.put("status", "400"); json.put("desc", "企業名稱爲空!"); } else { workService = new WorkServiceImpl(); //查詢是否存在該企業 Map enterpriseInfo = workService.getEnterpriseInfoByCustName(custName); //不存在該企業 if (enterpriseInfo == null) { json.put("status", "400"); json.put("desc", "企業名稱不存在!"); } else {//存在該企業,查詢企業主營類別前5事項 //根據企業名稱查詢出該企業近一年的已辦事項 String approveTypeList = workService.getEnterpriseWorksInfoByCustName(custName); //根據行業類別查詢企業名稱 String custNameListByIndustry = workService.getEnterpriseNameByIndustry((String) enterpriseInfo.get("INDUSTRY")); //查詢企業主營類別前5事項 List mainProjectList = workService.getApproveInfoList(custNameListByIndustry,approveTypeList); json.put("status", "200"); json.put("desc", "處理成功"); json.put("data", mainProjectList); } } // 響應請求 SysInfo.responseJsonMsg(response, json.toString()); }
(2)前端接收json數據並在前端進行顯示數組
$.ajax({ url: '${path.appMain}?service=work&func=getEnterpriseMainCategory', async: false, type: 'POST', data: { companyName:companyName }, success: function(msg){ var mainProjectList = ""; mainProjectList +="<li>與您的「主營項目類別」相同的企業,辦理最多的事項有:</li>" if(msg.data.length == 0){ mainProjectList += "<li>查找不到相關的事項!</li>"; } else{ for (var i = 0; i < msg.data.length; i++) { mainProjectList += "<li><a href='javascript:void(0);'>"+ (i+1) + "." + msg.data[i].approveName + "</a></li>"; } } $('#mainProjectList').html(mainProjectList); } });