<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<link href="https://cdn.datatables.net/1.10.19/css/jquery.dataTables.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="/book/assets/js/jquery-2.0.3.min.js" ></script>
<script src="https://cdn.datatables.net/1.10.19/js/jquery.dataTables.js" type="text/javascript"></script>
</head>
<body>
<table id="table1" class="display">
<thead>
<tr>
<th class="text-center">序号</th>
<th class="text-center">编号</th>
<th class="text-center">作者</th>
</tr>
</thead>
<tbody>
</tbody>
</table>
<script>
$(document).ready( function () {
$('#table1').DataTable({
language : {
"lengthMenu" : '每页显示<select>' + '<option value="10">10</option>'
+ '<option value="20">20</option>'
+ '<option value="30">30</option>'
+ '<option value="40">40</option>'
+ '<option value="50">50</option>' + '</select>条',
"paginate" : {
"first" : "首页",
"last" : "尾页",
"previous" : "上一页",
"next" : "下一页"
},
"processing" : "加载中...", //DataTables载入数据时,是否显示‘进度’提示
"emptyTable" : "暂无数据",
"info" : "共 _PAGES_ 页 _TOTAL_ 条数据 ",
"infoEmpty" : "暂无数据",
"emptyTable" : "暂无要处理的数据...", //表格中无数据
"search": "搜索:",
"infoFiltered" : " —— 从 _MAX_ 条数据中筛选",
"zeroRecords": "没有找到记录"
},
ajax : {
url:"http://localhost:8082/book/data/list",
data:{
limit:10
},
dataSrc: 'datax'
},
columns: [
{
"data": "offset",
"name" : "id",
"sDefaultContent":"", //默认空字符串
"sClass": "text-center"
},
{
"orderable" : false,
"data": "name",
'sClass': "text-center"
},
{
"orderable" : false,
"data": "author",
'sClass': "text-center"
}
]
});
} );
</script>
</body>
</html>
Datatables数据接口
最新推荐文章于 2021-02-12 23:26:36 发布