Flask - 如何在 Python ZC1C425268E18385D1AB44A 中使用 HTML 按钮的值？

Question

我是编程新手，过去只使用过一点 Python。 我正在使用 Flask 来建立一个网站来托管一个科学实验。 我在 pythonanywhere.com 上执行此操作。 在实验的最后一部分，参与者看到了 30 张单独的图像，他们必须说他们是否记得在实验的早期阶段看到过图像。

为此，我创建了一个 javascript function，它在每次运行 changeImage() 时随机显示 30 个图像之一。 下面是两个按钮，分别表示“是”和“否”。 按下按钮应更改显示的图像并将“是”或“否”发送到 flask_app.py，以及来自 javascript 的变量“x”。 这样 Python function 可以保存图像的编号以及参与者给出的答案。

Javascript

var array2 = new Array();
var index = 0
var x = 0
for (var i = 1; i < 31; i++) {
    array2.push(i);
}

function changeImage() {
    if (array2.length) {
        var index = Math.floor(Math.random() * array2.length);
          x = array2[index];
        var image = "/static/images/image" + x + ".jpg"
        document.getElementById('ad').src = image;
        array2.splice(index, 1);
    }
}

HTML

<body onload="changeImage()">
   <div class="w3-row-padding w3-padding-16 w3-center">
      <img id="ad" class="img-fluid" src="/static/images/image99.jpg" />

      <form action="{{ url_for('recog1') }}" id="answer" method="POST">
          <div class="w3-center">
             <input type="submit" id="answerY" value="Yes" name="Yes"
             style="width:47%;" class="w3-bar-item w3-button w3-padding-medium w3-blue"
             onclick= "changeImage();">

             <input type="submit" id="answerN" value="No" name="No"
             style="width:47%;" class="w3-bar-item w3-button w3-padding-medium w3-blue"
             onclick= "changeImage();">
          </div>
      </form>
   </body>

问题是我无法让我的 Python function 获取按钮本身的值。 我确实成功地将数据保存在网站的早期部分，用户必须在表单中输入他们的年龄和性别，但是当没有输入数据的字段时，我无法让它工作。 按钮本身的值应该被保存。

Python function

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

    Yes = request.form['Yes']
    No = request.form['No']

    entry_time = datetime.fromtimestamp(time.time()).strftime('%Y-%m-%d %H:%M:%S')

    #save to file
    with open(BASE_DIR + '/userinfo/userinfo.csv', 'a+') as myfile:
        myfile.write(
            str(entry_time) + ', ' +
            str(Yes) + ', ' +
            str(No) + ', '
            + '\n')
        myfile.close()

    return redirect(url_for("thankyou"))

现在，这里的数据有很多问题，它会立即 go 到感谢页面，而不是等待三十个按钮点击。 我稍后会更改这些内容，但首先问题是我什至无法将按钮值获取到我的 python 此处。 我总是收到“错误请求：浏览器（或代理）发送了此服务器无法理解的请求”。 我看过与此类似的 stackoverflow 问题，但它们对我来说从来没有用过，或者更有可能的是，我不知道如何将它们准确地应用于我的案例。 任何数量的帮助将不胜感激，并感谢您花时间阅读！

编辑：为了解决这个问题，我的 python function 中的Yes = request.form['Yes']和No = request.form['No']需要替换为x = request.form['Answer'] ，其中我将“Answer”设置为 HTML 中两个按钮的名称。

Answer 1

在您的 python 路线中试试这个

if request.method == 'POST':
    if "answerY" in request.form:
        print('yes button pressed')
    elif "answerN" in request.form:
        print('no button pressed')

编辑1：

尝试制作这样的路线，然后在您的 javascript function 中，您可以重新路由到该路线或在您的表单操作中处理它。

@app.route('/buttonresult/<button_id>', methods=['GET','POST'])
def buttonresult(button_id):
    yes_string = ''
    no_string = ''

    if button_id == 'answerY':
        # do something
        yes_string = 'Yes'
    elif button_id == 'answerN':
        # do something
        no_string = 'No'
    
    entry_time = datetime.fromtimestamp(time.time()).strftime('%Y-%m-%d %H:%M:%S')

    #save to file
    with open(BASE_DIR + '/userinfo/userinfo.csv', 'a+') as myfile:
        myfile.write(
            str(entry_time) + ', ' +
            str(Yes) + ', ' +
            str(No) + ', '
            + '\n')
        myfile.close()

    return redirect(url_for("thankyou"))

为了从 javascript function 重定向页面，您可以这样做

# get button_id value somehow
windows.location.href = '/buttonresult/" + button_id

Answer 2

我想也许我的评论不是很清楚，所以我发布了这个答案。

尝试将您的recog1 function 更改为以下内容：

@app.route("/recog1", methods=["POST"])
def recog1():
    print(request.form)
    return str(request.form)

当您按下“是”或“ Yes No按钮时，终端中会打印什么/您在浏览器中看到什么？ 你仍然收到同样的错误吗？

编辑 - 当您按下两个按钮之一时，只有一个值会显示在request.form中。 如果您考虑一下，这是有道理的——您只能按下两个按钮之一，但不能同时按下两个按钮。 如果您按下“是”按钮， request.form将有一个键值对Yes ，但没有No 。 如果您按下“否”按钮， request.form将有一个键值对用于No ，但没有用于Yes 。 您现在编写代码的方式假定request.form将始终具有两个键值对。 当然，这不可能是真的，因此无论您按下哪个按钮，另一个按钮的缺失都会导致您看到的错误。

您需要分别检查是否存在Yes和No键，然后基于此执行操作。

Flask - 如何在 Python ZC1C425268E18385D1AB44A 中使用 HTML 按钮的值？

问题描述

2 个解决方案

解决方案1
0 2021-05-27 15:08:03

解决方案2
0 已采纳 2021-05-27 16:30:36

Flask - 如何在 Python ZC1C425268E18385D1AB44A 中使用 HTML 按钮的值？

问题描述

2 个解决方案

解决方案1 0 2021-05-27 15:08:03

解决方案2 0 已采纳 2021-05-27 16:30:36

解决方案1
0 2021-05-27 15:08:03

解决方案2
0 已采纳 2021-05-27 16:30:36