Doc de Flask-WTF et WTForms :

• https://flask-wtf.readthedocs.io
• https://wtforms.readthedocs.io

YouTube:

• Des formulaires de pro avec Flask-WTF

pip install flask-wtf

forms.py

from flask_wtf import FlaskForm
from wtforms   import StringField
 
class RegisterForm(FlaskForm):
    name     = StringField('Nom', validators=[])
    password = PasswordField('Mot de passe', validators=[])
    submit   = SubmitField("S'inscrire")

Types de champs :

app.py

from flask import Flask, render_template, redirect, url_for
from forms import RegisterForm;
 
app = Flask(__name__)
 
@app.route('/register', methods=['get', 'post'])
def register():
    form = RegisterForm()
 
    # Si le formulaire a été validé
    if form.validate_on_submit():
 
        # Afficher les nouvelles valeurs des champs
        print('Nom: ' + form.name.data)
        print('Mot de passe: ' + form.password.data)
 
        # Insert dans la DB
 
        # Flash message
 
        # Rediriger vers une autre page
        return redirect(url_for('index'))
 
    # Sinon, initialiser les valeurs des champs
    form.name.data     = 'Dupont'
    form.password.data = ''
 
    # Afficher le formulaire
    return render_template('register.html', form=form)

Intégration dans le template :

register.html

<form action="" method="post">
    {{ form.hidden_tag() }}
    <div class="form-group">
        {{ form.name.label(class="form-label") }}
        {{ form.name(class="form-input") }}
    </div>
    <div class="form-group">
        {{ form.password.label(class="form-label") }}
        {{ form.password(class="form-input") }}
    </div>
    {{ form.submit(class="btn btn-primary") }}
</form>

forms.py

from flask_wtf          import FlaskForm
from wtforms            import StringField
from wtforms.validators import DataRequired, Email, Length, ValidationError
 
class RegisterForm(FlaskForm):
    email    = StringField('Nom', validators=[DataRequired(), Email()])
    password = PasswordField('Mot de passe', validators=[DataRequired(), Length(min=4, max=12)])
    submit   = SubmitField("S'inscrire")
 
    # validation custom
    def validate_email(self, email):
        if email.data == "root@domain.com":
            raise ValidationError("Cet email est déjà enregistré")

Intégrer les messages de chaque champ dans le template :

register.html

<div class="form-group">
  {{ form.email.label(class="form-label") }}
  {{ form.email(class="form-input" }}
  {% for error in form.email.errors %}
    {{ error }}
  {% endfor %}
</div>
 
<div class="form-group">
  {{ form.password.label(class="form-label") }}
  {{ form.password(class="form-input" }}
  {% for error in form.password.errors %}
    {{ error }}
  {% endfor %}
</div>

Classe formulaire :

...
 
class MyEditForm(FlaskForm):
 
    ...
 
    submit = SubmitField("Valider")
    cancel = SubmitField("Annuler")

Rendu dans le template (avec classes pour w3css ) :

<form action="" method="post" class="...">
    ...
 
    <div class="w3-section">
        {{ form.submit(class="w3-button w3-round w3-blue") }}
        {{ form.cancel(class="w3-button w3-round w3-white w3-border") }}
    </div>
</form>

Traitement du formulaire dans le contrôleur :

form = MyEditForm()
 
...
 
if form.validate_on_submit():
 
    # Selon qu'on a validé ou annulé, les champs
    # "submit" et "cancel" valent True ou False
 
    # Donc on peut faire ceci :
    if form.submit.data:
        # On a cliqué sur le bouton "Valider"
        ...
    if form.cancel.data:
        # On a cliqué sur le bouton "Annuler"
        ...