<form class="form-horizontal" role="form" id="form">
<div class="form-group">
<label for="olderName" class="col-sm-2 control-label">老人名稱</label>
<div class="col-sm-4">
<input type="text" class="form-control"
name="olderName" id="olderName" placeholder="老人名稱">
</div>
</div>
<div class="form-group">
<label for="olderNo" class="col-sm-2 control-label">老人編號</label>
<div class="col-sm-4">
<input type="text" class="form-control"
name="olderNo" id="olderNo" placeholder="老人編號">
</div>
</div>
<div class="form-group">
<div class="col-sm-6">
<button type="button" id="search" class="btn btn-primary pull-right">查詢</button>
</div>
<div class="col-sm-6">
<button type="submit" class="btn btn btn-default">清空</button>
</div>
</div>
</form>
js:
$(function () {
$('#search').click(function () {
var
formdata=$("#form").serialize();
console.log(formdata);
formdata = decodeURIComponent(formdata,true);
console.log(formdata);
formdata = encodeURI(encodeURI(formdata));
console.log(formdata);
$('#datatable').bootstrapTable('refresh', {
url:"${ctx}/bse/older/find?rnd="+Math.random()+"&"+formdata
});
});
});
後臺:
@RequestMapping(value="find",produces ="plain/text;
charset=UTF-8")
public String find(BseOlder bseOlder, HttpServletRequest request, HttpServletResponse response, Model model) throws UnsupportedEncodingException {
System.out.println("olderName:" + bseOlder.getOlderName() + "
olderNo:" + bseOlder.getOlderNo());
bseOlder.setOlderName(java.net.URLDecoder.decode(bseOlder.getOlderName(), "UTF-8"));
bseOlder.setOlderNo(java.net.URLDecoder.decode(bseOlder.getOlderNo(), "UTF-8"));
System.out.println("olderName:" + bseOlder.getOlderName() + "
olderNo:" + bseOlder.getOlderNo());
Page<BseOlder> page = bseOlderService.findPage(new Page<BseOlder>(request, response), bseOlder);
model.addAttribute("page", page);
return renderString(response,page.getList());
}
打印出的信息:
過程跟蹤:
- 查詢:“好人” 點擊提交;
- 從form表單中序列化數據到formdata
olderName=%E5%A5%BD%E4%BA%BA&olderNo=
好人變成 %E5%A5%BD%E4%BA%BA
- 步驟1中已經進行了一次encode編碼,解碼decodeURIComponent一次 olderName=好人&olderNo= 好人變成 好人
- 再一次encode編碼 olderName=%25E5%25A5%25BD%25E4%25BA%25BA&olderNo= 好人變成 %25E5%25A5%25BD%25E4%25BA%25BA
- 提交到後臺
- 後臺進行反向操作 接收到的數據 olderName=%25E5%25A5%25BD%25E4%25BA%25BA&olderNo= 封裝在bseOlder bean中
- 信息 進行數據進行URLdecode操作,URldecode操作和encodeURL操作是相反的操作 olderName:%E5%A5%BD%E4%BA%BA olderNo: 好人變成 %E5%A5%BD%E4%BA%BA
- 再次對信息進行轉碼 bseOlder.setOlderName(java.net.URLDecoder.decode(bseOlder.getOlderName(), "UTF-8")); 好人變成 好人
- 到此就完成了前臺到後臺的信息轉碼解碼之間傳遞。