你的代码是错误的,你把事情搞乱了,如果你想使用jQuery
and ajax
调用然后不要使用ModelAndView
在你的Spring
控制器。相反,请使用以下内容和return
your bean
or dto
as a json
using Jackson
图书馆来自Java
:
包括这个jar
在你的lib
项目文件夹:
http://www.java2s.com/Code/JarDownload/jackson/jackson-all-1.9.9.jar.zip http://www.java2s.com/Code/JarDownload/jackson/jackson-all-1.9.9.jar.zip
Java代码:
@RequestMapping(value = "businessBill.htm", method = RequestMethod.POST)
@ResponseBody
public String handleBusinessBillDetails(@RequestParam("reference") String billReference, @RequestParam("invoiceDate") String billDate,
HttpServletRequest request, HttpServletResponse response) {
String json = null;
try {
//1. Create 'jackson' object mapper
ObjectMapper objectMapper = new ObjectMapper();
BusinessBillDTO businessBillDTO = new BusinessBillDTO();
businessBillDTO.setBillDate(sdf.parse(billDate));
businessBillDTO.setBillReference(billReference);
BusinessBillDTO billDto = accountStatementBO.getBusinessBillDetails(businessBillDTO);
//2. Convert your 'bean' or 'dto' as 'json' string
json = objectMapper.writeValueAsString(billDto);
} catch (Exception ex) {
LOGGER.error(ex);
}
return json;
}
然后,在Table.jsp
放在div
用于Dialog.jsp
as hidden
,这将是你的modal
未来的对话框(请注意,有一些变化span
标签也):
<div id="BusinessBill" style="display:none;">
<h2>Bill Details</h2>
<em>Business Ltd</em>
<div class="row">
<span class="spanAsLabel">Account number</span>
<span id="dlg-account-number" class="spanAsLabel"></span>
</div>
<div class="row">
<span class="spanAsLabel">Bill date</span>
<span id="dlg-bill-date" class="spanAsLabel"></span>
</div>
</div>
现在修复你的getBusinessBill(..)
像这样的方法:
您还可以使用$.ajax
也许可以处理更多的状态,比如onerror
和其他人,但这种方式更简单(至少对我来说,你只需要评估返回的是否data
is null
或不让知道user
- if null
- 某事发生于server
侧面,也许显示出alert
带有一般消息) - 请阅读评论。
function getBusinessBill(billReference, billInvoiceDate) {
$.post("/AccountStatement/businessBill.htm", {
reference: billReference,
invoiceDate: billInvoiceDate
}, function (data) {
/* You can implement more validations for 'data', in my case I just used these 'if' conditionals but can vary. */
if(data != null) { //returned 'data' is not 'null'
/* parse 'data' as 'json' object
* will be good to console.log(data) and take a look. */
var obj = $.parseJSON(data);
if(obj != {}) { //check if 'data' is not an empty 'json' object once transformed
//set the 'data' in the dialog
$('#dlg-account-number').text(obj.accountNumber);
$('#dlg-bill-date').text(obj.billDate);
/* open modal dialog, you can simulate it this way (for this case)
* but the correct way is to use 'jquery-ui' dialog or any plugin you prefer.
* At this point you will see the hidden 'div' in a visible way with your 'data'.
*/
$('#BusinessBill').fadeIn();
} else {
//show 'generic' message
alert('No results found.');
}
} else {
//show 'generic' message
alert('An error occurred, try again.');
}
});
}
最后,如果一切正确,您将在同一页面看到(Table.jsp
) the modal
与你的对话data
,全部由ajax
调用以避免重定向页面,例如(Table.jsp
到 =>Dialog.jsp
).