Как добавить список тегов в форму Flask> WTForms> Jinja2? - PullRequest
Новая
       120

Как добавить список тегов в форму Flask> WTForms> Jinja2?

0 голосов
/ 28 мая 2020

Я создаю веб-форму и пытаюсь разрешить пользователям автоматически заполнять список тегов (во многом как StackOverflow использует здесь) без перезагрузки формы, которую затем можно отправить массово, нажав кнопку «Отправить».

Движок - это простая функция python, которая добавляет пустой список тегов, но я не могу правильно интегрировать эту функцию.

Я подозреваю, что проблема в том, что страница перезагружается, когда я нажмите кнопку «Добавить», но я не уверен и тем более уверен, как это предотвратить.

Спасибо за вашу помощь. Код ниже:

HTML: 

<form class="centered" action="" method="post" role="form" autocomplete=off>
    {{ form.hidden_tag() }}
    <p>{{ form.toppings(type="text", list="topps", placeholder="| e.g. cheese, tomato, etc.", **{"onchange":"addTag(tag,tags)"}) }}
    <datalist id="topps">
        {% for top in topps %}
        <option value={{ top }}>
        {% endfor %}
    </datalist>
    <span>{{ form.add(**{"onchange":"addTag(tag,tags)"}) }}</span></p><br>
    <p>
        {% for tag in tags %}
        <span>{{ tag }} {{ form.remove(value="x",**{"onchange":"tags.pop(0)"}) }}</span>
        {% endfor %}
    </p><br>
    <p>{{ form.submit(type="submit", value="Submit") }}</p>
    <p>{{ form.reset(type="reset", value="Reset", **{"onchange":"tags=[]"}) }}</p>
</form>

FLASK PYTHON: 

@app.route('/', methods=['GET', 'POST'])
@app.route('/index', methods=['GET', 'POST'])
def index():
    form = ToppingsForm()
    topps = Topps.query.all()
    tag = ''
    tags = []
    def addTag(tag,tags):
        if tag not in tags:
            tags.append(tag)
        else:
            tag = ''
    addTag = addTag(tag,tags)
    return render_template('index.html', title='Home', form=form, topps=topps, tag=tag, 
tags=tags, addTag=addTag)

FORMS.py: 

from flask_wtf import FlaskForm
from wtforms import StringField, PasswordField, BooleanField, SubmitField
from wtforms.validators import DataRequired

class ToppingsForm(FlaskForm):
    toppings = StringField('Toppings', validators=[DataRequired()])
    agree = BooleanField('Agree', validators=[DataRequired()])
    add = SubmitField('Add')
    remove = SubmitField('x')
    reset = SubmitField('Reset')
    submit = SubmitField('Submit')

1 Ответ

0 голосов
/ 28 мая 2020

Итак, я считаю, что вы ищете SelectMultipleField, предоставленный wtfform. Вам нужно что-то вроде этого: 

class ToppingsForm(FlaskForm):
    #toppings = StringField('Toppings', validators=[DataRequired()])
    toppings = SelectMultipleField('Toppings', choices=[],validators=[DataRequired()])
    #agree = BooleanField('Agree', validators=[DataRequired()])
    #add = SubmitField('Add')
    #remove = SubmitField('x')
    #reset = SubmitField('Reset')
    submit = SubmitField('Submit')

@app.route('/', methods=['GET', 'POST'])
@app.route('/index', methods=['GET', 'POST'])
def index():
    form = ToppingsForm()
    choices = [("cheese","cheese"), ("tomato","tomato"),("anchovies","anchovies"),("anchovies","mozarella")]
    form.toppings.choices = choices #you would change this to something like this[(c.id, c.name) for c in Topps.query.all()]

    if form.validate_on_submit():
        print(form.toppings.data)
        return "success"
    return render_template('base.html', title='Home', form=form)

Посмотрите, как использовать SelectMultipleFields для большего количества примеров

...