Layui数据表格使用

如何将数据快速的展现给用户，当然是用表格的方式呈现给用户，既直观，又整洁。我个人认为layui的数据表格做的很好，所以将使用layui的数据表格将数据展示给用户

首先得引入layui的插件

  <script src="~/Plugins/layui/layui.js"></script>

然后声明一个数据表，弹出层模块，数据表格模块

var tabStudent; //数据表格

     var layer, layuiTable;

然后便是加载和初始化layui模块

在tabStudent里面每个元素注意要使用逗号（，）隔开，而url则是数据原，是要调用控制器的中对应的action

控制器中的action则是查询表格中所需要的数据，比如一共有多少数据，每页多少条数据，一共多少页，然后将这些数据传给页面后才能自定义分页，最重要的就是数据，所以别传了分页数据，却忘记传查询出的数据，所以我将需要的数据使用一个类装在一起，保证数据的完整：

而elem 这个是在Html代码中的表格的ID：

而cols则是这张表的表头，当表头的字段太多时，就给每一个字段一个固定的width，这样即使页面装不下，layui也会自动生成一个表格数据的滚动条，方便查看数据

page则是是否开启分页，每页需要显示多少条数据，也可以自己选择每页显示多少条数据

这样一个简单的数据表格就完成了