How to know which button I clicked in flask?

Question

I my current project, my index page show several torrents with a button for each to start or stop the torrent.

I create the page with a form and a loop, so the forms have always the same names. But I need to know which button the user has clicked to know which torrent to stop !

Here is the template :

{% block content %}
 <h1>Hello, {{user}} !</h1>

 {% for torrent in torrents %}
      <form action="/index" method="post" name="torrent">
           {{torrent.control.hidden_tag()}}
           <p><a href='/torrent/{{torrent.id}}'>{{torrent.name}}</a> is {{torrent.status}} and {{torrent.progress}} % finished. <input type="submit" value="Start / Stop">
           </p>
      </form>
  {% endfor %}

Here is the view :

  @app.route('/index', methods = ['GET', 'POST'])
  def index():
  user = 'stephane'

  torrents = client.get_torrents()

  # for each torrent, we include a form which will allow start or stop
  for torrent in torrents:
    torrent.control = TorrentStartStop()
    if torrent.control.validate_on_submit():
        start_stop(torrent.id)

return render_template("index.html", title = "Home", user = user, torrents = torrents)

So, how do I know which torrent the user want to stop/start ?

Ezarra

Can we see the code for hidden_tag? – Warwick

Thomas is right, since you open a form per torrent the whole problem is really non-existant, since you can simply submit the info hash in a hidden field. My answer assumes a single form for the whole page or listing. – Stamm

Answer 1

Assuming hidden_tag creates a hidden input with name torrent_id and value the ID of the torrent, you will find the torrent id in request.form["torrent_id"]:

from flask import request

....
torrent_id = request.form["torrent_id"]

Warwick

The hidden_tag is just a csrf protection tag. But I will try something using your advice. – Ezarra

@Ezarra Just replace the a with <input type="submit" name="torrent_id" value="{{ torrent.id }}"/> and you'll be good. – Warwick

Ok, so this solved the "which button is clicked" problem, and by the way, I learn about the button I didn't know (I knew the input, not the button). But now comes the fact that I get as many answer as I have torrents inline because of the loop ! So how do I launch the function only one time ? – Ezarra

Answer 2

Use a HTML <button type="submit"> element and either set the value to the info hash, or set a formaction URL that includes the info hash (formaction is HTML5 only).

Stamm

Answer 3

u can use active button status with js , if someone clicked button and change its css class to active button and than check which button is active and get its informations.

this is js code :

var btnContainer = document.getElementById("myDIV");

var btns = btnContainer.getElementsByClassName("btn");

for (var i = 0; i < btns.length; i++) {
 btns[i].addEventListener("click", function() {
  var current = document.getElementsByClassName("active");
current[0].className = current[0].className.replace(" active", "");
this.className += " active";
 });
  }

and this is css for buttons :

  .btn {
    border: none;
    outline: none;
    padding: 10px 16px;
    background-color: #f1f1f1;
    cursor: pointer;
    }


   .active, .btn:hover {
    background-color: #666;
    color: white;
    }

Chem