CODEWITHSUNDEEP
pythonflaskformshttp-post
Ryan
Ryan

Reputation: 1432

Send table data via form to Flask method

I'm wondering why this isn't working as planned. The table below is in a form. Every table row has a book id and book title. The book title is formatted as a button, so that I can use the post method on form submission. When the button is clicked, the method (as shown below) fires well enough, but the book id isn't passed along to the method. I need the book id passed to the underlying method, as it will be used in a SQL query. Is there a way for me to make this happen?

{% block body %}
<div class="align-center">
    <form action="{{ url_for('books') }}" method="post">
        <table class="table">
            <thead>
                <tr>
                    <th></th>
                    <th>Book ID</th>
                    <th>ISBN #</th>
                    <th>Title</th>
                    <th>Author</th>
                </tr>
            </thead>
            <tfoot>
                <tr>
                    <td colspan="6"></td>
                </tr>
            </tfoot>
            {% for book in books %}
            <tr>
                <td></td>
                <td name="bookid">{{ book.id }}</td>
                <td name="bookisbn">{{ book.isbn }}</td>
                <td name="booktitle"><button btn style="border:none; border-bottom: 1px solid black;">{{ book.title }}</button></td>
                <td name="bookauthor">{{ book.author }}</td>
            </tr>
            {% endfor %}
        </table>
    </form>
</div>
{% endblock %}

And here's the Flask method to which I'm posting:

@app.route("/books", methods=["POST"])
@login_required
def books():
    bookid = request.form.get("bookid")
    return render_template("books.html", message=bookid)

Upvotes: 4

Views: 9061

Answers (2)

Ivan Velichko
Ivan Velichko

Reputation: 6709

You can submit values from the HTML form only using <input> elements. So, you need to either convert your <td name="..."> elements to <input>s or add a hidden input near each <td>:

...
<td name="bookid">{{ book.id }}</td>
<input type="hidden" name="bookid" value="{{ book.id }}" />
<td name="bookisbn">{{ book.isbn }}</td>
<input type="hidden" name="bookisbn" value="{{ book.isbn }}" />
...

Upvotes: 6

Steven
Steven

Reputation: 854

Why not try adding it this way?

<td name="booktitle"><button btn value={{book.id}} style="border:none; border-bottom: 1px solid black;">{{ book.title }}</button></td>

Upvotes: 1

Related Questions