Send table data via form to Flask method

Question

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)

Ivan Velichko · Accepted Answer · 2018-08-11 20:20:28Z

6

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 }}" />
...

answered Aug 11, 2018 at 20:20

Ivan Velichko

6,7497 gold badges49 silver badges98 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

Ryan Over a year ago

I had no idea that submission was off of the input field. Everything seemed to key off of the "name" attribute, which is a stupid inference in retrospect. Thanks for the help and the education!

Steven · Accepted Answer · 2018-08-11 20:04:42Z

1

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>

answered Aug 11, 2018 at 20:04

Steven

8541 gold badge8 silver badges23 bronze badges

Collectives™ on Stack Overflow

Send table data via form to Flask method

2 Answers 2

1 Comment

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

1 Comment

Comments

Your Answer

Sign up or log in

Post as a guest

Related