Home > Software design >  Bootstrap form value empty
Bootstrap form value empty

Time:10-17

I have the following select form from bootstrap.org and customized to my needs but when I use request.form() the ouput is always empty:

HTML

    <form method="POST" action="{{ url_for('addPOTM') }}">
      <div class="form-row align-items-center">
        <div class="col-auto my-1">
          <label class="mr-sm-2" for="inlineFormCustomSelect">Add Player</label>
          <select class="custom-select mr-sm-2" id="inlineFormCustomSelect">
            <option selected>Choose...</option>
            {% for rows in dropdown %}
            <option value="{{ rows.Name }}">{{ rows.Name }}</option>
            {% endfor %}
          </select>
        </div>
        <div class="col-auto my-1">
          <button type="submit" class="btn btn-primary" name="newPOTM">Submit</button>
        </div>
      </div>
    </form>
</div>

Python:

import sqlite3, logging
from flask import Flask, render_template, request, url_for, flash, redirect, jsonify
from werkzeug.exceptions import abort

@app.route('/potm')
def potm():
    conn = get_db_connection()
    dragdrop = conn.execute("SELECT * FROM POTM ORDER BY listorder ASC")
    dropdown = conn.execute('SELECT Name FROM alltime ORDER BY Name ASC').fetchall()
    return render_template('potm.html', dragdrop=dragdrop, dropdown=dropdown)

@app.route("/addPOTM",methods=["POST","GET"])
def addPOTM():
    conn = get_db_connection()
    if request.method == 'POST':
        Name = request.form['newPOTM']
        print(Name)
    return redirect(url_for('potm'))

Feel like it is very simple and I already had it today but did not save it and now cant see what I did earlier today :( Need a break

CodePudding user response:

I added name="newPOTM" also to the line

<select id="inlineFormCustomSelect">

and it works

CodePudding user response:

You are reading the value of newPOTM:

if request.method == 'POST':
        Name = request.form['newPOTM']
        print(Name)

And your form submits it in a button element (with empty value):

<button type="submit" class="btn btn-primary" name="newPOTM">Submit</button>

when you realy needs read the value of the select element. Simply add the correct name attribute to the select (and remove it from the button):

<select class="custom-select mr-sm-2" id="inlineFormCustomSelect" name="newPOTM">
  • Related