ajax json 前後臺互動 示例
阿新 • • 發佈:2018-12-20
java前後臺引數的接收方式 一般的ajax請求,一般封裝為map或者dto,後臺比較方便接收,下面是封裝為map
function submitEditData(value) { var valuemap ={rateRuleDatas:value}; var rateRuleDatas = JSON.stringify(valuemap); $.ajax({ url : 'compilingRule/compilingRuleUpdate.do',//只能是string型別的引數,開頭可以有"/",也可以沒有 type : 'post', //預設是get,後臺可以用@GegMapping獲取@RequestMapping接,也put、delete,但一些瀏覽器不支援 async : false,//預設是true,非同步請求,會卡住瀏覽器,使用時視情況而定 cache : true, //預設是true,下次請求時,從瀏覽器快取中載入請求資訊,dataType為script時,預設為fasle dataType : "json", //伺服器的返回型別。JQuery將自動根據http包mime資訊返回responseXML或responseText,並作為回撥函式引數傳遞。可用的型別如下: xml:返回XML文件,可用JQuery處理。html:返回純文字HTML資訊;包含的script標籤會在插入DOM時執行。 script:返回純文字JavaScript程式碼。不會自動快取結果。 json:返回JSON資料。 jsonp:JSONP格式。使用SONP形式呼叫函式時,例如myurl?callback=?,JQuery將自動替換後一個“?”為正確的函式名,以執行回撥函式。 text:返回純文字字串。 contentType : "application/json", //傳送到伺服器的資料格式,編碼型別預設為"application/x-www-form-urlencoded",適用於大多數情況。 data : rateRuleDatas, //Object或string,若是contentType : "application/json",那資料就要JSON.stringify(datas)轉為json success : function(data) { if (data.code == 200) { $.messager.alert('提示', data.message, 'info'); datas = []; columns = []; initTable(); } else { $.messager.alert('提示', data.message, 'info'); } } beforeSend : function() { $.messager.progress({ title : '提示', msg : '資料儲存中,請稍候……', text : '' }); }, complete : function() { $.messager.progress('close'); }, error : function(e) { $.messager.alert('提示', "網路錯誤,請重試!!", "info"); } }); @PostMapping("/compilingRuleUpdate.do") @ApiOperation(value = "修改滿編率規則資料", notes = "修改滿編率規則資料") @ResponseBody public ResultInfo updateCompilingRateRule(@RequestBody Map<String,Object> rateRuleDatas) { List<Map<String, String>> objlist = (List<Map<String, String>>) rateRuleDatas.get("rateRuleDatas"); String loginUM = getLoginUM(); return compilingRuleService.updateCompilingRule(rateRuleDatas,loginUM); } 當把js改為var rateRuleDatas = JSON.stringify(value)時,也可以用下面的方式接收,JSON來說net.sf.json.*; @PostMapping("/compilingRuleUpdate.do") @ApiOperation(value = "修改滿編率規則資料", notes = "修改滿編率規則資料") @ResponseBody public ResultInfo updateCompilingRateRule(@RequestBody String rateRuleDatas) { //String loginUM = getLoginUM(); //return compilingRuleService.updateCompilingRule(rateRuleDatas,loginUM); JSONArray jarr = JSONArray.fromObject(rateRuleDatas); List<HashMap<String, String>> listmap = (List<HashMap<String, String>>) JSONArray.toCollection(jarr,HashMap.class); for (HashMap<String, String> hashMap : listmap) { for (Entry<String, String> entry : hashMap.entrySet()) { System.out.println(entry.getKey()+":"+entry.getValue()); } } return null; } 2.檔案上傳的ajax請求,processData預設是true,把傳送請求的資料轉為物件。但是上傳檔案時用false,contentType上傳檔案時就不能是默認了。讓伺服器自己解析 //js部分 檔案上傳 function uploadDoc() { var form = new FormData(); form.append("file",document.getElementById("commissionTargetFile").files[0]); $.ajax({ url : 'theoryRateConfig/uploadTheortyExcel.do', type : "post", data : form, cache : false, processData : false, contentType : false, success : function(data) { } } //java 部分 @PostMapping("uploadTheortyExcel.do") @ResponseBody public ResultInfo uploadTheortyExcel(HttpServletResponse httpResponse, HttpServletRequest httpRequest) { ResultInfo resultInfo = new ResultInfo(); //預設上傳成功 resultInfo.setCode(ResponseUtil.success_code); resultInfo.setMessage("檔案上傳成功"); MultipartHttpServletRequest multiRequest = (MultipartHttpServletRequest) httpRequest; List<MultipartFile> files = multiRequest.getFiles("file"); MultipartFile file = files.get(0); return resultInfo; }
補充:url上get方法請求時,在java方法裡用RequestParam 來接
@RequestMapping(value = "hi", method = RequestMethod.GET) @ResponseBody public String helloConsumer(@RequestParam String name) 而在post請求時,用@RequestBody 來接 @PostMapping("/bankRankConfig/updatePartyARankRato.do") @ResponseBody @ApiOperation(value = "修改甲方排名系數配置", notes = "修改甲方排名系數配置") public ResultInfo updatePartyARankRato(@RequestBody String ratioDtolist)