CODEWITHSUNDEEP
pythonflaskvue.js
Ben Mayo
Ben Mayo

Reputation: 1325

Flask - getting a value from a Vue MultiSelect Element

I have a Vue-multiselect, as in this example (not mine) https://jsfiddle.net/gmsa/04jvjuv3/

I'm trying to get the value in the multi select element and POST it back to my Flask app.

HTML

    <form action="" method="POST">
    <multiselect id="multi", name = "multi" :multiple="true" :hide-selected="true" :selected="selected" :options="options" :taggable="false" @update="updateSelected"></multiselect>
    <button type="submit" value="l1" >Load</button>
    </form>

Flask

if request.method == 'POST':
    print request.form.getlist('multi')
    #prints an empty list
    print request.form['multi']
    #hits a bad request error

I've been klutzing about with this for a long time now - why can't I get the value from the form element?

Upvotes: 0

Views: 415

Answers (1)

Luis Orduz
Luis Orduz

Reputation: 2887

The thing is that vue-multiselect is meant to be handled using pure javascript. So, you could just use the solution implemented by the user in that issue.

In HTML:

<input style="display: none;" :value="selected" name="multiselect">

Inside the form, and in python:

request.form.get('multiselect').split(',')

The split is in case multiple options were selected.

BTW, that fiddle uses old versions of both vue and multiselect, but that's unrelated.

Upvotes: 1

Related Questions