Get HTML table row data to Flask function

Question

I have an HTML table with several columns in the below template. The last column of the table has a button. The code is as follows.

index.html

<table id="deployment_table" class="table table-striped">
   <thead>
      <tr>
         {% for col in colnames %}
         <th>{{ col }}</th>
         {% endfor %}
      </tr>
   </thead>
   <tbody>
      {% for record in records %}
      <tr>
         {% for col in colnames %}
         <td>{{ record[col] }}</td>
         {% endfor %}
         <td class="td-actions text-right">
            <a href=ct_edit ><input type="submit" name="edit_btn" value="update"rel="tooltip" class="btn btn-info"></a>
            </input>
         </td>
      </tr>
      {% endfor %}
   </tbody>
</table>

When the user click the button of a specific row, I need to pass the value of the first column of the selected row to a Flask function and load another HTML page using this data.

Below is the flask back end function.

@app.route('/ct_edit')
def ct_edit():
    print('ct_edit')
    # the value of the first column of the selected row => ID
    # do something with the ID value and get a result
    return render_template('ct_edit.html', result=result)

So far I'm unable to make this work. Can I please have any advice for this?

MikeG · Accepted Answer · 2024-03-02 13:14:51Z

2

First of all, note that your input tag closes the anchor tag when it should be the other way around not sure it does affect the code in this example but it's good to keep them in order though.

Second thing, Flask has something called url_for which helps you take an advantages of Jinja template and instead of hardcoding the html's page name you can refer to respective functions' name and pass a specific variables (You do that as shown below - in places where you have reference or action you place in href = "{{ url_for("name of the function") }}"

In this example since you want to get to a specific record - point a specific value for each record. I placed row["id"] which refers to specific unique value for this record in the table (I assume you have some column that has unique values for every row - that's what should be placed in url_for).

Then in the Flask function ct_edit which is responsible for displaying specific row you've choosen by clicking an anchor tag, should receive that unique value as an argument(place it in route as well so that the records would be distinguishable).

<a href="{{ url_for("ct_edit", record_id = row["id"]) }}"><input type="submit" name="edit_btn" value="update"rel="tooltip" class="btn btn-info">
        <i class="material-icons"></i></input></a>

@app.route('/ct_edit/<int:record_id>')
def ct_edit(record_id):
    print('ct_edit')
    # the value of the first column of the selected row => ID
    # do something with the ID value and get a result
    return render_template('ct_edit.html', result=result)

I hope I managed to brighten things for you a little bit.

Keep well :)

edited Mar 2, 2024 at 13:14

answered Jan 6, 2021 at 11:34

MikeG

681 silver badge7 bronze badges

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

1 Comment

dinblk Over a year ago

Yes indeed. Thanks a lot both for the answer and for showing an elegant way of achieving this at the same time! Keep well :)

Collectives™ on Stack Overflow

Get HTML table row data to Flask function

1 Answer 1

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related