'Flask HTML form sending GET requests and seemingly randomly sending POST requests

I am writing a Web App using Flask and Python, and I have some forms that should take values and pass them into the next page but the form sends GET requests and not POST requests but the weirdest part is that sometimes they will seemingly randomly go through as POST requests. I can see in the terminal that it's sending GET requests whenever I submit the form, even with different values, but then suddenly it will work and a POST request will be sent instead and I can see the values on the next page.

info.html:

<form method="POST" action="{{ url_for('form2')}}" id="form1">
        <div class="container">
            <div class="row justify-content-start">
                <div class="col">
                    <p>Enter your details below please.</p>
                </div>
            </div>
            <div class="row">
            </div>
            <div class="row justify-content-center">
                <div class="col-sm-1 justify-content-center">
                    <label for="age">Age</label>
                </div>
                <div class="col-sm-3">
                    <input type="number" class="form-control" id="age" name="age" required>
                </div>
            </div>
            <br>
            <div class="row justify-content-center">
                <div class="col-sm-1 justify-content-center">
                    <label for="sex">Sex</label>

                </div>
                <div class="col-sm-3">
                    <select class="form-control" id="sex" name="sex" required>
                        <option disabled selected value>Please select an option</option>
                        <option value="M">Male</option>
                        <option value="F">Female</option>
                    </select>
                </div>
            </div>
        </div>
        <div class="col p-3 text-center">
            <button type="submit" class="btn btn-dark align-items-center" name="firstbtn" formmethod="post">
                <a href="{{ url_for('form2')}}">Next</a>
            </button>
        </div>

    </form>

This form should allow the user to enter a number for age and select a letter for sex.

app.py

@app.route('/form1', methods=['GET', 'POST'])
def form1():
    if request.method == 'GET':
        return render_template('info.html')
    else:
        return render_template('error.html')


@app.route('/form2', methods=['POST', 'GET'])
def form2():
    if request.method == 'POST':
        age = request.form['age']
        sex = request.form['sex']
        return render_template('info2.html', age=age, sex=sex)
    else:
        return render_template('info.html')

This code should ideally get the age and sex from the form and store it to display in the next page if the request method is POST and will reload the Example HTML file if it is a GET request.

Below is an example of the terminal when I try to enter values and it is being put through as GET requests until the end where it finally goes through as a POST. With each submission I put slightly different values but it also happens when I put the same ones through each time.

Terminal

Up to this point, I have tried using formmethod, making sure it is "method" instead of "methods" in the form tag, re-arranging POST and GET in the app.route, making sure all the inputs are named and some other things I found while trying to research this issue.

Sorry for the long-winded post and thanks in advance.



Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source