Python 中的烧瓶过滤器 Search/List

Question

我在 python 搜索页面部分创建了一个国家列表，数据被发送到 Html table 使用 jinja 语法“ The Html table 也有一个 JavaScript 函数，它可以正常运行，不需要帮助”。我想将数据列表中的数据放在一个单独的文件中，然后将其返回到 python，然后使用现有的 jinja 语法将其发送到 Html table 而不是更改渲染模板函数中的任何内容。在数据字段中查看一些国家/地区列表的示例，但目的是在其中包含更多，将它们放在单独的文件中并将它们调用到 python 搜索页面然后将它们发送到 Html table 通过渲染模板函数。我知道有一种方法可以通过 JSON 来完成，但据我所知，我还没有能够完成它。关于如何执行此操作的任何想法。谢谢。

Python 例子

# Country page section.
@app.route('/search')
@login_required
def search():

    countryTables = ("Country", "Yearly Water Use", "Daily Water Use", "Population M")

    data = [
        ("Nigeria", "160,470,000,000 mᶟ", "216 liter.p.capital", "216,139,589"),
        ("Ethiopia", "10,550,000,000 mᶟ", "279 liter.p.capital", "122,963,588"),
        ("Egypt", "77,550,100,000 mᶟ", "2,202 liter.p.capital", "120,334,404")
    ]

    return render_template('search.html', countryTables=countryTables, data=data)

HTML 例子

{% extends "layout.html" %}
{% block title %}
    Search Page
{% endblock %}
{% block content %}

<div class="container">
    <br>
    <h3>Country Search!</h3>
    <div class="input-group input-group-lg">
        <input aria-describedby="inputGroup-sizing-lg" aria-label="Sizing example input" class="form-control" id="countryInput"
         onkeyup="countryFunction()" placeholder="Search for Country.." type="text">
    </div>
        <table id="countryTable" class="table table-hover">
            <thead>
                <tr>
                    {% for countryTable in countryTables %}
                    <th scope="col">{{ countryTable }}</th>
                    {% endfor %}
                </tr>
            </thead>

            <tbody>
                {% for row in data %}
                <tr>
                    {% for cell in row %}
                    <td> {{ cell }}</td>
                    {% endfor %}
                </tr>
            {% endfor %}
            </tbody>
        </table>
    </div>
{% endblock %}

Answer 1

像这样在 JSON 文件中保存国家详细信息（我们将其命名为 country.json:

{
    "0": ["Nigeria", "160,470,000,000 mᶟ", "216 liter.p.capital", "216,139,589"],
    "1": ["Ethiopia", "10,550,000,000 mᶟ", "279 liter.p.capital", "122,963,588"],
    "2": ["Egypt", "77,550,100,000 mᶟ", "2,202 liter.p.capital", "120,334,404"]
}

在你的路线中：

import json

@app.route('/search')
@login_required
def search():
    countryTables = ("Country", "Yearly Water Use", "Daily Water Use", "Population M")
    
    f = open('country.json',)
    countryData = json.load(f)

    return render_template('search.html', countryData=countryData, countryTables=countryTables)

在您的 HTML 文件中：

{% extends "layout.html" %}
{% block title %}
    Search Page
{% endblock %}
{% block content %}

<div class="container">
    <br>
    <h3>Country Search!</h3>
    <div class="input-group input-group-lg">
        <input aria-describedby="inputGroup-sizing-lg" aria-label="Sizing example input" class="form-control" id="countryInput"
         onkeyup="countryFunction()" placeholder="Search for Country.." type="text">
    </div>
        <table id="countryTable" class="table table-hover">
            <thead>
                <tr>
                    {% for countryTable in countryTables %}
                    <th scope="col">{{ countryTable }}</th>
                    {% endfor %}
                </tr>
            </thead>

            <tbody>
                {% for row in countryData %}
                <tr>
                    {% for cell in countryData[row] %}
                    <td> {{ cell }}</td>
                    {% endfor %}
                </tr>
            {% endfor %}
            </tbody>
        </table>
    </div>
{% endblock %}

Python 中的烧瓶过滤器 Search/List

Flask Filter Search/List in Python

html

javascript

python

jinja2

flask