文件查看遇到一个问题，每个表的字段名不一样，所以用表格展示时要动态的展示，表格不固定。
要分两次获取数据：1.表的字段名。2.表中的数据。
layui.use('table', function(){
var table = layui.table
data_key=[]
$.ajax({
type: "GET",
url: "/get_table_details_key?table_name={{ table_name }}&database_name={{ database_name }}",
dataType: "json",
success: function(data){
for (i=0;i<data.len;i++){
data_key[i]={field:data.data[i][0],title:data.data[i][1],120}
}
table.render({
elem: '#demo'
,height: 620
,url: '/get_table_details?table_name={{ table_name }}&database_name={{ database_name }}' //数据接口
,page: true //开启分页
,cols: [data_key]
});
}
});
//第一个实例
});
完整的HTML：
<!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8"> <title>Layui</title> <meta name="renderer" content="webkit"> <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1"> <link rel="stylesheet" href="../static/CSS/layui/css/layui.css" media="all"> <!-- 注意：如果你直接复制所有代码到本地，上述css路径需要改成你本地的 --> </head> <body> <div class="layui-layout layui-layout-admin"> <div class="layui-header"> <div class="layui-logo layui-hide-xs layui-bg-black">智能数据库系统</div> <!-- 头部区域（可配合layui 已有的水平导航） --> <ul class="layui-nav layui-layout-left"> <!-- 移动端显示 --> <li class="layui-nav-item layui-show-xs-inline-block layui-hide-sm" lay-header-event="menuLeft"> <i class="layui-icon layui-icon-spread-left"></i> </li> <li class="layui-nav-item layui-hide-xs"><a href="index">导入</a></li> <li class="layui-nav-item layui-hide-xs"><a href="table_list">数据字典</a></li> <li class="layui-nav-item layui-hide-xs"><a href="tolook">可视化</a></li> </ul> <ul class="layui-nav layui-layout-right"> <li class="layui-nav-item layui-hide layui-show-md-inline-block"> <a href="javascript:;"> <img src="//tva1.sinaimg.cn/crop.0.0.118.118.180/5db11ff4gw1e77d3nqrv8j203b03cweg.jpg" class="layui-nav-img"> tester </a> <dl class="layui-nav-child"> <dd><a href="">Your Profile</a></dd> <dd><a href="">Settings</a></dd> <dd><a href="">Sign out</a></dd> </dl> </li> <li class="layui-nav-item" lay-header-event="menuRight" lay-unselect> <a href="javascript:;"> <i class="layui-icon layui-icon-more-vertical"></i> </a> </li> </ul> </div> <div class="layui-side layui-bg-black"> <div class="layui-side-scroll"> <!-- 左侧导航区域（可配合layui已有的垂直导航） --> <ul class="layui-nav layui-nav-tree" lay-filter="test"> <li class="layui-nav-item"><a href="/index">导入数据</a></li> <li class="layui-nav-item"><a href="/table_list">已导入数据</a></li> </ul> </div> </div> <div class="layui-body"> <!-- 内容主体区域 --> <div style="padding: 15px;"> <table id="demo" lay-filter="test"></table> </div> </div> <div class="layui-footer"> <!-- 底部固定区域 --> 寒蝉鸣泣之时 </div> </div> <script src="../static/CSS/layui/layui.js"> </script> <script src="../static/js/jquery-1.7.2.min.js"> </script> <script> //JS layui.use(['element', 'layer', 'util'], function(){ var element = layui.element ,layer = layui.layer ,util = layui.util ,$ = layui.$; //头部事件 util.event('lay-header-event', { //左侧菜单事件 menuLeft: function(othis){ layer.msg('展开左侧菜单的操作', {icon: 0}); } ,menuRight: function(){ layer.open({ type: 1 ,content: '<div style="padding: 15px;">处理右侧面板的操作</div>' ,area: ['260px', '100%'] ,offset: 'rt' //右上角 ,anim: 5 ,shadeClose: true }); } }); }); layui.use('table', function(){ var table = layui.table data_key=[] $.ajax({ type: "GET", url: "/get_table_details_key?table_name={{ table_name }}&database_name={{ database_name }}", dataType: "json", success: function(data){ for (i=0;i<data.len;i++){ data_key[i]={field:data.data[i][0],title:data.data[i][1],120} } table.render({ elem: '#demo' ,height: 620 ,url: '/get_table_details?table_name={{ table_name }}&database_name={{ database_name }}' //数据接口 ,page: true //开启分页 ,cols: [data_key] }); } }); //第一个实例 }); </script> </body> </html>
请求处理部分：
@app.route('/get_table_details_key') def get_table_details_key(): table_name=request.values.get("table_name") database_name=request.values.get("database_name") english_china=[] english_china=dictionary.get_table_details_key(table_name,database_name) print("表key值：(table_name="+table_name+",database_name="+database_name+")") print(english_china) return jsonify({"data": english_china,"len":len(english_china)}) pass @app.route('/get_table_details') def get_table_details(): table_name=request.values.get("table_name") database_name=request.values.get("database_name") table_data=dictionary.get_table_details(table_name,database_name) english_china=dictionary.get_table_details_key(table_name,database_name) data_re=[] flag={} count=len(table_data) for table_data_flag in table_data: flag = {} for i in range(len(english_china)): flag[english_china[i][0]] = table_data_flag[i] data_re.append(flag) print("表的内容：(table_name="+table_name+",database_name="+database_name+")") print(data_re) return jsonify({"code": 0, "msg": "", "count": count, "data": data_re})
数据库查询部分：
def get_table_details(name_table,database_name): #中文名，英文名，数据类型，单位 # select column_name,column_comment ,data_type,CHARACTER_MAXIMUM_LENGTH,COLUMN_DEFAULT # from information_schema.columns # where table_name='表名' and table_schema='bigwork_data' #英文名，中文名，字段类型，字段长度，缺省值，单位在数据的第一行 sql="select * from "+name_table res = query_mysql(sql) return res pass def get_table_details_key(name_table,database_name): sql = "select column_name,column_comment " \ "from information_schema.columns " \ "where table_name='" + name_table + "' and table_schema='" + database_name + "'" res = query_mysql(sql) return res