一个DataTables页的典型流程是:
1. 访问一个url让系统渲染一个普通的前端页面
2. 页面上内含一段javascript, 生成DataTables对象,然后立即向后端请求数据,最后在本页中填充数据
默认情况下DataTables不做任何初始过滤,待用户在searchField输入框中输入值后,才会做过滤。
现在的需求的,在上述#1步的url中即传入参数,如list.jsp?userId=123. 期望在第2步结束后,
1. userId对应的searchField输入框中显示123
2. 显示的数据已按userId=123过滤
网上搜了下,没看到较好的方案。最终自己使用了这样一套做法:
1. 通过MVC后端把userId=123的值渲染回JSP的searchField输入框中
//以SpringMVC为例
model.put("userId",
request.getParameter(request, "userId"));
<!-- list.jsp -->
<tfoot>
<tr>
<th>
<input type="text" class="searchField" size="1" placeholder="精确匹配" value='<c:out value="${userId}"/>'>
</th>
<tr>
...
</tfoot>
2. 在dataTable对象加载完后,立即轮询一下所有searchField, 如果有值,触发一次搜索。
<!-- list.jsp -->
<script>
table.columns().eq( 0 ).each( function ( colIdx ) {
var footerColumn = $( 'input.searchField', table.column( colIdx ).footer() );
var value = footerColumn.attr("value");
if(value){
table
.column( colIdx )
.search( value )
.draw();
}
} );
});
</script>