https://stackoverflow.com/questions/32019733/getting-value-from-select-dynamic-tag-using-flask

Question

I am working on the my final project by doing a to do list. I created a dynamic table displaying all my tasks and I added a menu on which you can select a new status. Unfortunately I can't manage to get the value from this drop down list!

My HTML (focus on drop down list)

<td><select name= "task_action" method="POST" action="/">
      {% for action in actions %}
        <option value="{{action}}" selected='selected'>{{action}}</option>
      {% endfor %}
    </select>
</td>

After selecting a new value in my drop down menu and clicking on submit button I am willing to update my database so here is my py code

My app py:

db.execute("UPDATE todolist SET status = :status WHERE id = :task_id",
            task_id=request.form['submit_button'],
            status=request.form.get('task_action'))

I also tried with status=request.form['task_action']but it doesn't work, I get Bad Request.

I found this https://stackoverflow.com/questions/10434599/how-to-get-data-received-in-flask-request/16664376#16664376 but still I couldn't solve my issue.

Thanks for your help!

EDIT BELOW

Following question about "Where in the HTML is an element with name="submit_button"?" I edit adding the full code.

There is an other submit_button which enables me to post a new task. I am then displaying a table with all the tasks and I want to be able to update the status of the tasks, but I can't manage to get the new status to update my database and then update the display of the to do list.

My full HTML

    <form action="/" method="post">
        <div class="form-group">
            <input autocomplete="off" autofocus class="form-control" name="newtodo" placeholder="Type a task" type="text" required/>
        </div>
        <button class="btn btn-primary" name="submit_button" type="submit" value="add_task">Add</button>
    </form>

    <table class="table table-striped">
        <thead>
            <tr>
                <th>#</th>
                <th>Task</th>
                <th>Status</th>
                <th>Action</th>
                <!--<th>Save</th>-->
            </tr>
        </thead>

        <tbody>
            {% for task in tasks %}
                <tr>

                  <td>{{ task.id }}</td>
                  <td>{{ task.todotask }}</td>
                  <td>{{ task.status}}</td>
                  <td><select name= "task_action" method="POST" action="/">
                      {% for action in actions %}
                      <option value="{{action}}" selected='selected'>{{action}}</option>
                      {% endfor %}
                      </select>
                  </td>
                  <td><form action="/" method="post">
                          <button class="btn btn-primary" name="submit_button" type="submit" value= "{{ task.id }}">Update</button>
                       </form>
                  </td>
                </tr>
            {% endfor %}
        </tbody>
    </table>

My full app py

@app.route("/", methods=["GET", "POST"])
@login_required
def index():
    """Show to do list"""

    if request.method == "POST":
        # Ensure it is the button for adding task
        if request.form['submit_button']=='add_task':
            # Ensure added task is not empty
            if not request.form.get("newtodo"):
                return apology("must key a task", 400)
            new_todo=db.execute("INSERT INTO todolist(userid, todotask, status, date) VALUES(:userid, :task, :status, :date)",
                          userid=session["user_id"],
                          task=request.form.get("newtodo"),
                          status="new",
                          date=datetime.now())
            flash("Added!")
        else:
            flash("Hold on!")
            db.execute("UPDATE todolist SET status = :status WHERE id = :task_id",
            task_id=request.form['submit_button'],
            status=request.form.get('task_action'))

    tasks = db.execute("SELECT * FROM todolist WHERE userid = :user_id ", user_id=session["user_id"])

    for task in tasks:
        tasks=tasks

    actions = ['On hold', 'Completed', 'In progress']

    return render_template("todolist.html", tasks=tasks, actions=actions)

Answer 1

New info based on question edit:

task_action is not submitted with the form because the select is not part of the form (ie not within the <form> tags).

Once you correct that, the table should get updated.

There are other problems in the html (which may or may not cause problems going forward). Suggest you validate the source, as with Nu Html when you get a chance.

---

This status=request.form.get('task_action') looks like the correct way to get the new status. This task_id=request.form['submit_button'] looks questionable. It will fail if request.form has no key named submit_button. (The python get() method as used in the status= will not give such a key error). Where in the HTML is an element with name="submit_button"?

Perhaps you can add debug info with a print(request.form) to see what data is being sent to the server.