asp.net mvc+jquery+layui页面数据表的显示和分页查询

以我刚入门正在学习的一个重庆邮电大学的一个项目来演示

运行起来打开页面查看查询到的数据返回到页面的数据表格

学院信息维护页面的数据查询以及显示到页面中！

第一步：在javascript中使用layui这个插件（plugin）来创建一个动态数据表（table），申明layer和layuiTable这两个变量，方便全局变量使用，再申明一个tabAcademe存放表格！

引入jquery-3.2.1插件，在javascript中的jquery代码块中使用layui插件来创建一个table，在jquery代码块中在先使用layui模块，然后在layui模块中说明layer和layuiTable等于layui的layer和table

初始化tabAcademe表格，render是layui插件中初始化表格的一个方法，elem获取html那边table的ID，url是数据查询的接口，连接控制器，

cols表头这段代码可以layui官网中查询出来粘贴复制，然后修改成自己想要的一个表头。

type：’radio’是单选框，type：’checkbox’是复选框，fixed：’left’是把选框这个列固定在左边，title是一个标题可以随便更改，field：’XXX’这个是对应html的input标签的name，这个hide：true是将这个列设为隐藏列，对应html的一个隐藏inoput

显示出来的数据需要和数据库那边相对应

最后面这个title则是一个固定在右边的操作按钮列，width:160和align：’center’是给定这个列的宽度为160个像素和设置按钮在这个列中居中，templet：setOperate是设置自定义按钮的方法

这个自定定义操作按钮系列需要申明一个数据的ID，和一个返回按钮，这个返回按钮的点击事件中拼接是一个参数

最后再写一个page分页显示数据

limit指定每页显示的条数

limits每页条数的选择项

第二步：到控制器写查询数据的方法

SelectAcademeAll这个方法对应初始化表格url的方法

LayuiTablePage是一个实体类，需要到控制器顶部using引用实体类这个文件

这个LayuiTablePage实体类有page当前页面、limit每页数据量、GetStartIndex分页开始序号、GetEndIndex分页结束序号

使用linq的方法查询数据

不知道数据是什么类型就使用var，var是匿名数据类型，它在编译的时候C#会把它翻译成具体的数据类型。查询学院from 自定义一个表名tbAcademe，数据来自model中的学院表，model需要在控制器顶部引入

和实例化

不需要where条件，然后根据学院ID排序orderby一下查询出来的学院数据，select是查询

计算一下查询出来的学院数据的总行数

学院数据是int类型所以用int，也可以用var，但是知道具体类型还是用具体类型比较好

使用linq查询之后分页查询数据

List是列表，把查询的学院数据放到一个列表中，数据来源于linq查询出来的数据，Skip是从哪里开始查询，layuiTablePage.GetStartIndex()是之前引入的一个实体类从分页开始处查询，Take是跳转到哪里，layuiTablePage.limit是跳转到哪一页数据，ToList()是查询多条数据，这是查询一整个学校有多少学院所以要使用ToList()，如果只查询一条数据用Single()就可以了

引入一个LayuiTableDate实体类，LayuiTableDate实体类中有数据状态码（可以不设置）、状态信息（可以不设置）、总行数（必须设置）、数据（必须）

实例化new一下这个LayuiTableDate<SYS_Academe>，然后把计算出来的数据的总行数放进LayuiTableDate实体类中的count和把分页查询的数据放到LayuiTableDate实体类中的data，最后把封装好的数据返回到页面显示出来