Ajax发布到springmvc控制器,用于刷新数据表
Ajax post to spring mvc controller which refresh datatables
我正在尝试创建一个元数据存储区,该存储区使用web gui搜索数据。该应用程序是在我的spring应用程序中使用ajax和数据表构建的。
背景:
搜索区域如下所示:
====================================================================
= Start Date = Table search[ ] =
= ___________________ = ------------------------------------- =
= |2012-12-11 09:24:03| = - - =
= = - - =
= Stop Date = - - =
= ___________________ = - - =
= |2012-12-11 09:24:40| = - - =
= = - - =
= Duration > = - - =
= ___________________ = - - =
= | 00:4:40 | = - - =
= = - - =
= ___________________ = - - =
= | Search | = ------------------------------------- =
= = showing 1 of 2000 entries Page 1 =
====================================================================
搜索.js
var table;
var searchpage = document.getElementsByTagName('base')[3].href;
searchRecording=function()
{
var startDate = $('#startDate').data('date');
var stopDate = $('#stopDate').data('date');
var duration = $('#duration').data('date');
$.ajax({
"type": 'POST',
"url": searchpage,
"data": JSON.stringify({
"startDate": startDate,
"stopDate": stopDate,
"duration": duration,
}),
success : function(response) {
alert(response);
},
error : function(e) {
alert('Error: ' + e);
},
contentType: "application/json",
dataType: "json"
});
}
window.searchBtn.onclick = function()
{
return function()
{
searchRecording();
}
}();
var searchBtn = document.getElementById("searchBtn");
table = $('#table').DataTable({
"bProcesing" : true,
"bServerSide" : true,
"bLenthChange" : false,
"lengthMenu": [[10, 15, 20, 25, 50], [10, 15, 20, 25, 50]],
"iDisplayLength" : 10,
"iDisplayStart": 0,
"sEcho":1,
"sAjaxSource":searchpage,
"fnServerData": function(searchpage, aoData, fnCallback)
{
$.ajax({
"dataType" : 'json',
"type" : "POST",
"url" : searchpage,
"data" : aoData,
"success" : fnCallback
});
},
"columns": [
{ data: "id" },
{ ....Other Columns.... } ,
]
});
SearchController.java(控制器)
@RequestMapping(value = "/searchpage", method = RequestMethod.POST, produces = "application/json")
public @ResponseBody String showRecordings(
@RequestParam (required=true) int sEcho,
@RequestParam (required=true) int iDisplayStart,
@RequestParam (required=true) int iDisplayLength
)
{
System.out.print(sEcho+" ");
System.out.print(iDisplayStart+" ");
System.out.println(iDisplayLength+" ");
//String startDate = (String) data.get("startDate");
//String stopDate = (String) data.get("stopDate");
//String duration = (String) data.get("duration");
DataTablesTO<Rec> dt = new DataTablesTO<Rec>();
List<Rec> recs = recordingsService.getAllRecs(iDisplayStart, iDisplayLength);
Long size = recordingsService.getAllRecsSize();
dt.setAaData(recs); // This is the dataset reponse to client
dt.setiTotalDisplayRecords(size.intValue()); // the total data in db for datatables to calculate page no. and position
dt.setiTotalRecords(size.intValue()); // the total data in db for datatables to calculate page no.
dt.setsEcho(sEcho);
return toJson(dt);
}
private String toJson(DataTablesTO<?> dt)
{
ObjectMapper mapper = new ObjectMapper();
try
{
return mapper.writeValueAsString(dt);
}
catch (JsonProcessingException e)
{
e.printStackTrace();
return null;
}
}
Search.jsp
表单包含引导日期时间选择器,提交表单的按钮是
<button id="searchBtn" class="btn btn-primary" type="button">Search</button>
问题:
如果能帮助我理解如何将表格与表格联系起来,我将不胜感激。例如,如果我按下搜索按钮,开始日期和停止日期会发送到控制器,控制器会搜索数据并将结果返回到使用ajax 自动刷新的表
- 我的方法正确吗
- 我的代码中有多余的部分吗
- 我应该如何将日期值传递给控制器
- 当我按下搜索按钮时,我应该如何传递数据表初始化值
目前我得到以下错误:
org.springframework.web.bind.MissingServletRequestParameterException: Required int parameter 'sEcho' is not present
有人能帮忙吗?
感谢
从客户端发送所需数据和从服务器端获取数据的方法不同。您从客户端发送一个对象,但在服务器端需要3个。客户端:
"data" : aoData,
服务器端:
@RequestParam (required=true) int sEcho,
@RequestParam (required=true) int iDisplayStart,
@RequestParam (required=true) int iDisplayLength
一种方法是,在服务器端获取DTO(数据传输对象)中的数据,DTO只是一个包含多个字段的对象,这些字段对应于您正在发送的多个数据。所以,把所有的数据都放在那个定制的卑鄙小人里,然后从那个定制中得到单独的数据。
目前您正在发送一个对象,但您必须期望3,其中第一个是数字。从而产生误差。
相关文章:
- 用于刷新的Javascript更改查询字符串
- Javascript仅适用于jQuery mobile中的页面刷新
- 在 AngularJS 中,用于选择不同控制器的选项 - 如何刷新
- GULP:如何在不刷新的情况下更新浏览器(仅适用于 CSS 更改)
- 帮助用于验证码的图标类,如刷新,耳机,帮助不在浏览器上显示
- 在模型更改时刷新 Dojo MVC 组不适用于复杂对象
- 用于刷新下拉列表的ajax回发方法
- 刷新窗口时获取URL;不适用于Chrome扩展
- 加载时刷新页面仅用于IE
- 用于刷新信息的XML到HTML函数
- Mobile Safari:JS事件,用于在刷新时跳转到最后一个滚动位置
- Javascript用于使用VS2010刷新图像
- 用于cookie删除和页面刷新的Beforeunload事件
- jQuery格式不应用于ajax数据,尽管刷新
- 活动链接可用于页面刷新,但不能滚动
- Python代码,用于在线解析大型JSON数据和主机,但会定期刷新
- 用于外部调用时刷新页面的XMLHttpRequest
- Ember和htaccess用于刷新
- Ajax发布到springmvc控制器,用于刷新数据表
- 用于刷新页面的Asp.Net静态方法