bootstrap DataTable 插件的使用

//引入css和js文件 

<link rel="stylesheet" href="${ctx}/static/plugins/datatables/dataTables.bootstrap.css">

<script src="${ctx}/static/plugins/datatables/jquery.dataTables.min.js"></script>
<script src="${ctx}/static/plugins/datatables/dataTables.bootstrap.min.js"></script>

//正文  保证table  thead tbody 等标签的完整性

<div class="box-body table-responsive no-padding" style="overflow-x:hidden">  //下面过长的滚动条取消
<table class="table table-hover table-text" ></a>
</td>
</tr>
</c:forEach>
</tbody>
</table>
</div><!-- /.box-body -->

 

 

 

$(function () {                                           //获取id的table
$('#resourcetable').DataTable({
"bJQueryUI": true,
"oLanguage": { // 语言设置
"sLengthMenu": "每页显示 _MENU_ 条记录",
"sZeroRecords": "抱歉， 没有找到",
"sInfo": "从 _START_ 到 _END_ /共 _TOTAL_ 条数据",
"sInfoEmpty": "没有数据",
"sInfoFiltered": "(从 _MAX_ 条数据中检索)",
"sZeroRecords": "没有检索到数据",
"sSearch": "搜索:",
"oPaginate": {
"sFirst": "首页",
"sPrevious": "前一页",
"sNext": "后一页",
"sLast": "尾页"
}
}
});
});