使用 Python 的动态表

Posted 2023-03-05

【中文标题】使用 Python 的动态表

【英文标题】：Dynamic table with Python

【发布时间】：2019-01-31 19:59:15

【问题描述】：

我正在开发一个小型网站，它必须从 API 获取一些数据并将其显示在表格中（我不知道需要多少行，这取决于 API）。我选择 Python 作为后端编程语言，选择 Flask 作为 Web 框架。我需要在页面开始时从 Python 向 API 发出请求，并将其结果显示在 html 模板中的表格中。带有一些参数的 render_template 不能做到这一点——因为它不能动态显示 HTML 元素，只能显示文本。如果没有 JS/JQuery 或最低限度地使用它，我怎么能做到这一点？这是我的表格代码（它是 Bootstrap 4）

<table class="table table-bordered" id="users">
  <thead>
    <tr>
      <th>ID</th>
      <th>Имя</th>
      <th>Фамилия</th>
      <th>Действие</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td rowspan="1">3319</td>
      <td>...</td>
      <td>...</td>
      <td><a href="#">Выбрать</a></td>
  </tbody>
</table>

【问题讨论】：

您可以在使用 Flask 的 render_template 提供 html 文件时使用 Jinja2

【参考方案1】：

您可能也对此模式感兴趣，使用 python 包 pandas：

import pandas as pd

@app.route('/table')
def display_table():
    # do something to create a pandas datatable
    df = pd.DataFrame(data=[[1,2],[3,4]])
    df_html = df.to_html()  # use pandas method to auto generate html
    return render_template('page.html', table_html=df_html)

然后在 page.html 中包含以下内容：

 table_html | safe 

您需要包含 safe 过滤器，以便它呈现原始 html 而不会转义任何字符。

这将呈现以下内容，您还可以使用 pandas 中可用的参数和 Styler 对其进行样式化。

<table border="1" class="dataframe">  
<thead>    
<tr style="text-align: right;">      
<th></th>    
<th>0</th>      
<th>1</th>    
</tr>  
</thead>  
<tbody>    
<tr>      
<th>0</th>     
<td>1</td>     
<td>2</td>   
</tr>    
<tr>      
<th>1</th>    
<td>3</td>     
<td>4</td>    
</tr> 
</tbody>
</table>

编辑：仅供参考，这对于您有复杂或动态条件格式的问题也很方便，这更容易在 python/pandas 服务器端设置样式，而不必担心 html 模板。当然这取决于你在做什么，但我认为这在某些情况下更易于维护——比如我的！

【参考方案2】：

使用 Jinja2 时，您可以使用 Jinja2 的脚本功能动态创建表格，语法与 Python 非常相似：

<table>
 <thead>
  %- for column in columns %
     <th> column </th>
  %- endfor %
 </thead>

 <tbody>
 %- for row in items %
    <tr>
    %- for column in columns %
       <td> row|attr(column) </td>
    %- endfor %
    </tr>
 %- endfor %
 </tbody>
 </table>

在调用render_template时，您需要提供两个变量“columns”包含行的列列表和“items”包含行。

无需使用JS。

如果你想支持一些特殊的数据类型，比如链接，你可以通过在模板中使用 if 语句来实现。

更多详情请参见 Jinja2 的参考： http://jinja.pocoo.org/docs/2.10/templates/

【讨论】：

使用这段代码 Jinja2 给了我一个错误：jinja2.exceptions.UndefinedError: 'attr' is undefined，如果我用row[column] 替换attr(row, column)，它只显示有两个空行的空表。

@crinny：我想，我错了—— attr 是一个过滤器。试试这个： row|attr(column)

@juegern 与row[column] 的结果相同。我的代码：return render_template('desk.html', columns=['Id', 'Test'], items=['1', 'test str'])

@crinny：项目必须是行列表。你这里有一个简单的值列表。你用 SQLAlchemy 之类的吗？

@juegern 不，我现在不使用任何数据库。

【参考方案3】：

我已经编辑了@juegern 的答案以使用<a> 标签，现在我的代码看起来是这样的：

<table class="table table-striped" id="users">
 <thead>
  %- for column in columns %
     <th> column </th>
  %- endfor %
 </thead>

 <tbody>
 %- for row in items %
    <tr>
    %- for column in columns %
        % if row[column]['link'] %
            <td><a href=" row[column]['link'] "> row[column]['text'] </a></td>
        % else %
            <td> row[column] </td>
        % endif %
    %- endfor %
    </tr>
 %- endfor %
 </tbody>
 </table>

将一些数据从 Flask 应用到该表的代码： items_list = ['1': 'Hello', '2': 'World', '3': 'link': '#', 'text': 'Open', '1': 'World', '2': 'Hello', '3': 'link': '#', 'text': 'Open'] return render_template('your_file_name.html', columns=['1', '2', '3'], items=items_list)