Flask - 即使单击提交按钮后,仍将复选框及其选中的值保留在页面中

问题描述 投票:0回答:1

我希望即使在提交生成按钮后,复选框仍保留在左侧 div 中,并保留之前检查的值。

我将页面分成两部分(类似于streamlit侧边栏)。 第一个用户将检查复选框,然后提交生成按钮,右侧 div 中显示一个表格和图片,该表格和图片来自 python 中的生成函数。在按钮提交后,此复选框消失。我希望他们留下来并让用户随时更改它并相应地工作。 前端不是我喜欢的。 我已经开始学习了,请帮忙。

@app.route('/')
def index():

    table_names = get_table_names()
    return render_template('combined.html', table_names=table_names,db_name=database)

@app.route('/generate', methods=['POST'])
def generate():
    import time
    selected_tables = request.form.getlist('table')
......
    return render_template('combined.html', tables=[data_dict.to_html(classes='data')], titles=[''],graph_done=graph_done)

这是合并的.html

<body>

    <div id = "container">

  <div class="left">


    <form method="post" action="/generate">
        {% for table_name in table_names %}
        <input type="checkbox" name="table" value="{{ table_name }}" >{{ table_name }}<br>
        <input type="hidden" name="selected_tables" value="{{ selected_tables|join(',') }}">

        {% endfor %}
        <input type="submit" value="Generate">
    </form>
  </div>
  <div class="right">
      {% if tables %}
        {% for table in tables %}
            {{ titles[loop.index] }}
            <table class="table-container" style="margin: 0 auto;"> <!-- Center the table -->
                {{ table|safe }}
            </table>
    {% endfor %}
    {% endif %}
  </div>
    </div>
</body>

我希望即使在提交按钮后复选框仍保留。

python html css flask
1个回答
0
投票

您可以

session
实现这一目标:

from flask import session

# Set Up a Secret Key
app.secret_key = 'BAD_SECRET_KEY'

@app.route('/')
def index():
    
    # Initializing selected_tables variable
    if 'selected_tables' not in session.keys():
        session['selected_tables'] = []

    table_names = get_table_names()
    return render_template('combined.html', table_names=table_names,db_name=database)

@app.route('/generate', methods=['POST'])
def generate():
    import time
    selected_tables = request.form.getlist('table')

    # Updating selected_tables variable
    session['selected_tables'] = selected_tables
......
    return render_template('combined.html', tables=[data_dict.to_html(classes='data')], titles=[''],graph_done=graph_done)

现在您可以通过

selected_tables
对象访问
combined.html
中的
session
变量:

{% for table_name in table_names %}
<input type="checkbox" name="table" value="{{ table_name }}" {{ 'checked' if table_name in session['selected_tables'] }}>{{ table_name }}<br>
<input type="hidden" name="selected_tables" value="{{ selected_tables|join(',') }}">

{% endfor %}
© www.soinside.com 2019 - 2024. All rights reserved.