JQuery.datatable —— 条件查询动态渲染Table_search datatables 动态渲染

JQuery.datatable —— 条件查询动态渲染Table

前言

通过页面条件，重新渲染表格内容。

关键代码

<!-- 定义动态表格 -->
var initTable =  $('#tableTestFindAll').DataTable({
	"ajax": {
	    url: "tableTestAjaxFindAll",
	    dataSrc:
	            function (data) {
	                console.log("Ajax 查询回调 : " + data);
	                return data.data;
	            },
	    type: "post"
	},
	...
	...
	...
});

function searchQueryClick() {
	// 获取条件信息
    var columnId = $('#columnId').val();
    // 组装条件数组
    var param = {
    	// K : V
        "columnId" : columnId
    }
    // 将数组作为条件放入表格ajax内
    initTable.settings()[0].ajax.data = param;
    // 通过ajax渲染表格
    initTable.ajax.reload();
}
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29

OK，这样参数就传递过去了，后台通过VO接收参数，然后自行处理即可。