带有csv文件中的html和javascript的表

Question

该表大约有10,000行。 页面加载时需要很长时间。

我想在其中添加排序，过滤和分页功能。我该怎么做？

我想要一些有关如何在Javascript和Ajax中使用数据表的知识。

Answer 1

您可以考虑使用此解决方案。 它需要一些Python知识，特别是Pandas（一个python库）和Flask（微框架）。

使用此代码片段读取csv并转换为html表。

Python代码

@app.route("/")
def show_tables():
    data = pd.read_csv("myfile.csv")
    return render_template('index.html',tables=[re.sub(' mytable', '" id="example', data.to_html(classes='mytable'))],
    titles = ['Excel Data to Flask'])

的index.html

<!doctype html>
<head>   
<link rel=stylesheet type=text/css href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css">
<link rel=stylesheet type=text/css href="https://cdn.datatables.net/plug-ins/f2c75b7247b/integration/bootstrap/3/dataTables.bootstrap.css">
<!--<link rel=stylesheet type=text/css href="https://cdn.datatables.net/responsive/1.0.4/css/dataTables.responsive.css"> -->
</head>
<body>
<div class=page> 
  {% for table in tables %}
    <h2>{{titles[loop.index]}}</h2>
    {{ table|safe }}
  {% endfor %}
</div>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.1.1/jquery.min.js"> </script>
<script src="https://cdn.datatables.net/1.10.15/js/jquery.dataTables.min.js"> </script>
</body>
</html>

您可以在此处阅读有关此主题的更多信息：熊猫：CSV到HTML

这将使您可以更轻松，更快速地读取csv文件，以及使用javascript datable。

带有csv文件中的html和javascript的表

问题描述

1 个解决方案

解决方案1
0 已采纳 2018-11-23 06:41:16

带有csv文件中的html和javascript的表

问题描述

1 个解决方案

解决方案1 0 已采纳 2018-11-23 06:41:16

解决方案1
0 已采纳 2018-11-23 06:41:16