《Layui数据表格的绑定》
成都创新互联公司是一家专注网站建设、网络营销策划、微信小程序开发、电子商务建设、网络推广、移动互联开发、研究、服务为一体的技术型公司。公司成立10多年以来，已经为上千成都花箱各业的企业公司提供互联网服务。现在，服务的上千客户与我们一路同行，见证我们的成长；未来，我们一起分享成功的喜悦。
开发工具与关键技术：Visual Studio /.NET /layui插件
作者：肖春庆
撰写时间：2019年06月17日
在我们使用软件的过程当中有着许多数据在数据库里是需要我们进行数据的绑定，一般应用的是数据表格的绑定。并且显示给用户进行应用等等。我们知道数据在数据库里没有进行应用，那么数据库里的数据就是没有勇武之地，所以要进行数据表格的绑定。在这里我们应用layui致力于通过了分页逻辑，既可以轻松的进行绑定分页，也可以作为页面刷新分页的处理。
指定向一个用于存放分页的容器，通过服务端得到一些初始值，即可完成分页渲染。把layui的插件进行引用。要引用css样式布局的插件，它自定义了一些视图布局，我们可以根据自己的需求进行调用即可，同时它还进行了JS一些功能的封装，同样我们只需要根据自己的需求进行调用。
php 把数据导出到excel表格有多种方法，比如使用 phpExcel 等，以下代码是直接通过 header 生成 excel 文件的代码示例：
?php
header("Content-type:application/vnd.ms-excel");
header("Content-Disposition:filename=xls_region.xls");
$cfg_dbhost = 'localhost';
$cfg_dbname = 'testdb';
$cfg_dbuser = 'root';
$cfg_dbpwd = 'root';
$cfg_db_language = 'utf8';
// END 配置
//链接数据库
$link = mysql_connect($cfg_dbhost,$cfg_dbuser,$cfg_dbpwd);
mysql_select_db($cfg_dbname);
//选择编码
mysql_query("set names ".$cfg_db_language);
//users表
$sql = "desc users";
$res = mysql_query($sql);
echo "tabletr";
//导出表头（也就是表中拥有的字段）
while($row = mysql_fetch_array($res)){
$t_field[] = $row['Field']; //Field中的F要大写，否则没有结果
echo "th".$row['Field']."/th";
}
echo "/tr";
//导出100条数据
$sql = "select * from users limit 100";
$res = mysql_query($sql);
while($row = mysql_fetch_array($res)){
echo "tr";
foreach($t_field as $f_key){
echo "td".$row[$f_key]."/td";
}
echo "/tr";
}
echo "/table";
?等等 许多， 具体的在后盾网里面有详细的。
首先，最简单的先渲染一个表格，参考官方示例：
这里先讲讲一些渲染细节：
layui内部就是根据cols属性里面每项的field字段来输出数据（该字段跟后台返回的数据字段一致即可输出）。
另外，layui拼接html字符串的方式多次应用数组join方法的方式，这种方式值得安利一波：
否则用传统方式拼接html字符串就相形见绌了（不推荐）：
接着，看一下分页：
从图中可以看出，我们请求地址没加请求参数，layui自动帮我们添加了page，limit的请求参数，默认值分别为1, 10，这是开启了分页的缘故(page: true)。那么，请求参数名是否可以定制呢？答案是可以的，参考request属性：
同样，响应参数名也是可以定制的，参考response属性：
注意，以上只是定制了参数名字而已，接下来才是重头戏：定制数据格式，参考parseData属性：
parseData可以帮助我们定制好与layui对应的表格数据格式，从而输出表格，这是很有用的，毕竟后端前辈返回的数据格式未必跟layui的一致呀。有了以上3种定制方式，我们就不惧输出数据表格了。采用这种方式输出的就是真正的实现了分页，下文提及的方式可不是真正的分页。
-----------------------快乐的分割线，前方jojo高能-----------------------
可能也有小伙伴无视了 request、response、parseData 三剑客，转而用起了data属性，过程如下：
拒绝了使用url属性请求，转用jquery ajax请求数据，最后再tableIns.reload({ data: res.data })一波，达成666操作。
这种做法从结果上看，似乎是可以的。。。。。。搭嘎，口头挖撸。
因为通过data属性赋值是不会分页去请求后端的，而是直接请求全部数据，然后layui内部进行前端分页处理，这样一来，如果数据量大的话，恐怕页面就要刷好一会儿了o(╥﹏╥)o。（只有通过data方式赋值才会进行前端分页处理，所以url方式可以放心食用）。
