Get multiple input values from a Flask form before redirect

Question

I have a form which displays a list of values as buttons.

products = [ant,bat,cat,dog,egg]

Index.html

<form action="{{ url_for('show_products') }}" method="post">
      <ul class="list-group">
       {% for p in products %}
        <input type="submit" name="{{p}}" value="{{p}}" >{{p}}</input> 
        {% endfor %}
      </ul> 
      <button type="submit" class="btn btn-primary">Want to use this button to redirect</button>
    </form>

In app.py

@app.route('/show_products', methods=["POST", "GET"])
def show_products():
    result = []
    prod_data = {}
    if request.form:
            result = request.form
    prod_data['p_name'] = result
    return render('run_import.html', prod_data)

show_products.html

<h1>Hi</h1>
<p>p_name</p>

So everytime one of the products are clicked, ant, cat etc. The page immediately redirect to show_products.html and the name of the clicked product is shown.

I want the redirect to happen only when the button outside the for loop is clicked and every product that was clicked until then to be passed back as a list to show_products() and then to the html page.

can you share the route which is responsible for rendering the index.html templpate. — Aditya Naitan
– Aditya Naitan, Commented Sep 20, 2021 at 7:25
You could use checkbox to select multiple entries in a form and then one submit button. Would that help? — shoaib30
– shoaib30, Commented Sep 20, 2021 at 9:34

shoaib30 · Accepted Answer · 2021-09-20 09:45:00Z

You can use a checkbox to capture multiple entries and send them back to flask on click of submit

flask.py

@app.get('/')
def index():
    products = ['ant','bat','cat','dog','egg']
    return render_template('test.html', products=products)

@app.post('/show_products')
def show_products():
    products = request.form.getlist('products')
    return render_template('output.html', products=products)

You can use CSS to make the checkboxes as per your requirement

test.html

<form action="{{ url_for('show_products') }}" method="post">
    <ul class="list-group">
        {% for p in products %}
        <input type="checkbox" name="products" value="{{p}}">{{p}}</input>
        {% endfor %}
    </ul>
    <button type="submit" class="btn btn-primary">Want to use this button to redirect</button>
</form>

output.html

<ul class="list-group">
    {% for p in products %}
        {{p}}
    {% endfor %}
</ul>

If you need to use buttons to capture the values, you will need an onClick listener on each button to store the values in a list and send the list over on click of submit

Collectives™ on Stack Overflow

Get multiple input values from a Flask form before redirect

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related