Question

我正在进行小型Flask测试并尝试执行以下操作：

我有两种形式。

第一个 - 接收用户输入，然后有一个提交按钮。当按下提交按钮时，我想1.）使用'doritos'和'oreos'中的两个值然后执行后端Python程序2.）将一些相对文本返回给用户（即成功）同一页面，按钮旁边或某个文本窗口。

问题 - 如何将从此表单收到的值传递回foo？

问题 - 如何将文本值返回给用户？

第二个 - 基本按钮，它调用Python程序并返回并将一些相关文本返回给用户（即成功）。我假设我也可以使用上述问题来回答这个问题。

我继续在线查看的文档使用app.route并将用户路由到另一个带有结果的页面。我想让用户保持在同一页面上，只返回文本。如果这太模糊，你可以告诉我RTFM。只是很难搞清楚这一点。

请参阅下面的代码：

的index.html：

<form action="/foo" method="post">
CHIPS:<br>
<input type="text" name="doritos"><br>
SNACKS:<br>
<input type="text" name="oreos"><br>
<input type="submit" value="Submit">
</form>

<form action="/coo" method="post">
<input type="submit" name="pita" value="pita"><br>
<input type="submit" name="chip" value="chip"<br>
</form>

app.py

from flask import render_template
from app import app

@app.route('/')
@app.route('/index')
def index():
    return render_template("index.html", title='Home')

@app.route('/foo')
def foo():
    try:
        ..receive user-input values..
        ..do some back end actions..
        return 'Successful.'
    except:
        return 'Failed.'

@app.route('/coo')
def coo():
    try: 
        if request.form['pita']:
            ..do some back end actions..
            return 'Successful.'
        elif request.form['chip']:
            ..do some back end actions..
            return 'Successful.'
    except:
        return 'Failed.'

Answer 1

Flask内置Jinja2（您已经以render_template的形式使用它），因此解决此问题的一个简单方法是使用您的表单创建模板，然后通过发布数据时向模板发送“成功”或“失败”消息。

考虑以下index.html模板摘要：

<form action="/" method="post">
    CHIPS:<br />
    <input type="text" name="doritos"><br />
    SNACKS:<br />
    <input type="text" name="oreos"><br />
    <input type="submit" value="submit">
</form>
{% if fooResponse is not none %}
    {{ fooResponse }}
{% endif %}

<form action="/" method="post">
    <input type="submit" name="pita" value="pita"><br />
    <input type="submit" name="chip" value="chip"><br />
</form>
{% if cooResponse is not none %}
    {{ cooResponse }}
{% endif %}

您的Python可能看起来像这样（假设您不想离开/ / /index，并根据您的问题我假设每个表单显示的输出是非持久性和互斥的）：

@app.route('/')
@app.route('/index', methods=['GET', 'POST'])
def index():
    if request.method == "GET":
        return render_template("index.html")

    if request.form["submit"] == "submit":
        doritos = request.form["doritos"]
        oreos = request.form["oreos"]
        success = process(doritos, oreos)

        return render_template("index.html", fooResponse="Successful" if success else "Failed")

     elif request.form["submit"] == "pita":
        success = process("pita")
        return render_template("index.html", cooResponse="Successful" if success else "Failed")

     elif request.form["submit"] == "chip":
        success = process("chip")
        return render_template("index.html", cooResponse="Successful" if success else "Failed")

Answer 2

您可以将表单提交链接到javascript中的ajax调用。 ajax函数会将数据发送到api，python将进行所有计算并发送响应。 Ajax函数在前端接收该响应，并在前端显示您想要的任何文本/数据。

请考虑以下内容：

    $.ajax({
        type: "POST",
        url: "/api/oreos-and-doritos",
        dataType: "json",
        contentType: "application/json",
        data: JSON.stringify(data-from-form),
        success: function (data) {
            // do whatever changes are needed in the frontend,
            // like displaying a message
            $('#msg').text(data);
        },
        error: function (xhr, error, thrown) {
            // do some error handling here
        }
    }));

Flask - 具有后端操作的用户输入和按钮，将文本返回给用户

2 个答案: