Question

I am having an issue passing an item selected from an HTML drop down menu to a SQL query.

I'm not exactly sure what concept is missing from my code to make this work. Most examples I have found are in PHP and I'm not sure how to translate it to Python.

Here is the scenario. I'm using Flask and Sqlite and am try to let the user select an item from an HTML drop down menu. The item selected from the drop down menu will be used in a SQL query to retrieve information from a database and then display those results on a new page.

An example, the user selects "Red" from a drop down that has 3 options (Red, Blue, Green) and clicks a submit button. "Red" will be passed to a SQL query in my app.py file that will retrieve all data from rows where color = "Red". That retrieved data will then be displayed on /results.html.

I believe my problem is that I'm not correctly attributing a value to the items in my drop down menu and then passing that value to my Python code that is running the SQL query. This is my assumption on how this should work, but I might be missing something bigger here.

I have tried lots of bits of HTML to make this work, but I'm not even sure that is where my problem is occurring. When I hit "Submit" I'm taking the new page, but nothing from the database is displayed

Here is my code, for my 2 views ('/' & 'results.html') and my Python code:

@app.route('/results.html', methods=['GET','POST'])
def results():
    g.db = connect_db()

    cur = g.db.execute("SELECT * FROM all_items WHERE name = '{}'".format('Red'))
    posts = [dict(item=row[0], name=row[1]) for row in cur.fetchall()]
    g.db.close()
    return render_template('results.html', posts=posts)

Here is View where the the drop down menus exist

<select name="Item_1">
    <option value="Red">Red</option>
    <option value="Green">Green</option>        
</select>

<form name="Item_1" action="results.html" method='POST'>
    <button type="submit">Compare!</button>
</form>

Here is the View where the results from selecting "Red" should be displayed

% extends "template.html" %}
{% block content %}
<h2>Results</h2>

{% for p in posts %}
    <strong>Item:</strong> {{ p.item }}
    <strong>Name:</strong> {{ p.name}}  
{% endfor %}
{% endblock %}
Was it helpful?

Solution

You need to put your select inside the form.

<form name="Item_1" action="results.html" method='POST'>
    <select name="Item_1">
        <option value="Red">Red</option>
        <option value="Green">Green</option>        
    </select>
    <button type="submit">Compare!</button>
</form>

An even better way to declare the form would be

<form name="Item_1" action="{{ url_for('results') }}" method="POST">

OTHER TIPS

As mentioned by @dim put the select inside a the form and the chosen value can be got using request.form['Item_1']. However the item being queried is a select, so I would prefer using get instead of POST. From wiki, http://en.wikipedia.org/wiki/POST_(HTTP), POST is used when

The POST request method is designed to request that a web server accept the data enclosed in the request message's body for storage.[1] It is often used when uploading a file or submitting a completed web form.

So I would rather prefer GET, which can be used to query the database. When using GET, Item_1 can be passed as request parameters and got using flask.request.args

Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top