来自 Flask 表单（requests.get）的多个输入，只有第一个输入出现在 Python

Question

I'm looking to create a very simple web form that takes 3 user inputs (a word and two dates) and returns a result.我希望创建一个非常简单的 web 表单，它接受 3 个用户输入（一个单词和两个日期）并返回一个结果。 I have the script working, but only one of the user inputs is properly appearing.我有脚本工作，但只有一个用户输入正确显示。 The other two (the dates) are always set to the default values - regardless of what I import.另外两个（日期）始终设置为默认值 - 无论我导入什么。 I'm currently using request.forms.get() and the keys do not show up.我目前正在使用 request.forms.get() 并且没有显示密钥。 Attached is my code附件是我的代码

from flask import Flask, Response, render_template, request, jsonify


app = Flask(__name__)
num = 'Test'
start = '01-01-2020'
end = '09-01-2020'


@app.route('/') 
def index(): 
    return render_template('index.html') 

@app.route('/square/', methods=['POST']) 
def square(): 
    global num
    global start
    global end
    num = str(request.form.get('number', 'Term'))
    #start = datetime.date(request.form.get('start_date', datetime.now()))
    start = str(request.values.get('start', '2020-01-01'))
    end = str(request.values.get('end', '2020-09-01'))    
    print("------")
    print(num)
    print(start)
    print(end)
    data = {'square': num, 'start':start, 'end':end} 
    data = jsonify(data)
    return data

The search term correctly changes with user input, but not the dates.搜索词会随着用户输入而正确变化，但不会随日期变化。 In the below code, when the submit values button is pressed after user input, the two dates and terms should load.在下面的代码中，当用户输入后按下提交值按钮时，应加载两个日期和条款。 The dates and terms load properly for the output section of the front-end, but the dates do not appear on the backend.前端的 output 部分可以正确加载日期和条款，但后端不会显示日期。 The html code is attached below:下面附上html代码：

PE html> 
<html lang='en'> 
    <head> 
        <title>Flask App</title> 
        <style type="text/css"> 
            * { 
                font-family: sans-serif; 
            } 
        </style> 
    </head> 
    <body> 
        <h1>Program</h1> 
        <form method="post" form name="my_form" id="form"> 
            <label for="num">Enter Search Term : </label> 
            <input type="text" id="num" name="number" autofocus autocomplete="off" placeholder="Term">
            <!--- </br>  --->
            <label for="start_date">Enter Start Date: </label> 
            <input type="date" id="start_date" name="start" placeholder="01/01/2020">
            <!--- </br>  --->
            <label for="end_date">Enter End Date: </label> 
            <input type="date" id="end_date" name="end" placeholder="09/01/2020">  
            <button>Submit Values</button> 
        </form>
        <p id="square"></p> 
        <script src="https://code.jquery.com/jquery-3.2.1.min.js"></script> 
        <script> 
            $('#form').on('submit', function(e){ 
                var number = $('#num').val(); 
                var start_date = $('#start_date').val();
                var end_date = $('#end_date').val();
                e.preventDefault();
                function check() {
                        if(number == "")
                            number = "Test";
                        if(start_date == "")
                            start_date = "01-01-2020";
                    if(end_date == "")
                        end_date = "09-01-2020";
                    }
                check(); 
                $.ajax({ 
                    url: 'http://127.0.0.1:5000/square/', 
                    data: {'number': number},  <!--- this is the error --->
                    method: 'POST',
                    success: function(data) { 
                        $('#num').val(''); 
                        $('#square').html('Date Range of ' + start_date + ' to ' + end_date + ' with Term: "' + number + '" loaded! Click the button below.') 
                    },

                }); 
            }); 
        </script> 

    </body> 
</html>

Answer 1

You should remove the HTML for method since you have the method already declared in AJAX. This leaves you with something like this:您应该删除 HTML 方法，因为您已经在 AJAX 中声明了该方法。这给您留下了如下内容：

<form name="my_form" id="form">

Use Input buttons instead of buttons:使用输入按钮而不是按钮：

<input type="button" id="submit_form_btn" value="submit">

Then, correct the form identifier and change the event in your script:然后，更正表单标识符并更改脚本中的事件：

$('#submit_form_btn').on('click', function(e){

AJAX data should look like this: AJAX 数据应如下所示：

data: $('#my_form').serialize()

Finally, in flask, you should request form data in this manner:最后，在flask中，应该这样请求表单数据：

start_date = request.form['start_date']
end_date = request.form['end_date']

Montior ensure to monitor your browser console for error from the JS end of you application, you may add console.log('Submission Successful') to your success fucntion and console.log('something went wrong') for error function. Montior 确保从您的应用程序的 JS 端监控您的浏览器控制台是否有错误，您可以将console.log('Submission Successful')添加到您的成功函数中，并将console.log('something went wrong')添加到错误 function。

来自 Flask 表单（requests.get）的多个输入，只有第一个输入出现在 Python

问题描述

1 个解决方案

解决方案1
0 2020-09-22 20:40:37

来自 Flask 表单（requests.get）的多个输入，只有第一个输入出现在 Python

问题描述

1 个解决方案

解决方案1 0 2020-09-22 20:40:37

解决方案1
0 2020-09-22 20:40:37