−Table des matières

, , ,

:TODO:

Python : Gestion des formulaires via Flask-WTF

WTForms est une bibliothèque Python permettant de gérer des formulaires web via des Classes et objets en POO.

Ici on utilise le paquet Flask-WTF qui intègre la bibliothèque WTForms au micro framework Flask.

Initialiser l'application Flask

Création d'un dépôt git pour le projet et initialisation de l'application Flask : 

git init hello-wtf
cd hello-wtf/
git branch -m main
 
# Création de l'environnement et installation des packages
python3 -m venv venv
source venv/bin/activate
pip install Flask Flask-WTF
 
# Création de l'application Flask
mkdir -p helloforms/{static,templates}
touch helloforms/__init__.py
chmod a+x helloforms/__init__.py

Peupler le fichier helloforms/init.py :

__init__.py
#!/usr/bin/env python
 
from flask import Flask
 
 
app = Flask(__name__)
 
 
@app.route('/')
def show_home_page():
    """Build and return home page
 
    """
    return '<h1>Hello World!!!</h1>'
 
 
 
if __name__ == '__main__':
 
    # execution en mode debug
    app.run(debug=True)

Tester l'application via la commande flask run: 

FLASK_APP=helloforms FLASK_ENV=development flask run --debug

A ce stade la commande doit lancer le serveur web et afficher un message du type : 

* Serving Flask app 'helloforms'
 * Debug mode: on
WARNING: This is a development server. Do not use it in a production deployment. Use a production WSGI server instead.
 * Running on http://127.0.0.1:5000
Press CTRL+C to quit
 * Restarting with stat
 * Debugger is active!
 * Debugger PIN: 845-679-934

Ouvrir son navigateur à l'URL http://localhost:5000 doit afficher le message “Hello World!!!”

Pour la mise en forme, on utilise le framework Spectre CSS

Création du formulaire

from flask_wtf import FlaskForm
from wtforms import EmailField, SubmitField
from wtforms.fields.simple import BooleanField
 
class NewsLetterForm(FlaskForm):
 
    email = EmailField(label='Email')
    news_letter = BooleanField(label="S'abonner à la news letter")
    submit_button = SubmitField(label='Valider')

Comme illustré ci-dessus, le constructeur des objets héritant de la classe de base wtforms.fields.Field accepte notamment les paramètres :

La liste exhaustive des paramètres est disponible dans la documentation https://wtforms.readthedocs.io/en/3.2.x/fields/#basic-fields

Quelques objets représentant les champs de base des formulaires :

Champs plus spécifiques :

filters

Les filtres permettent de traiter (en amont de la validation), les valeurs saisies par l'utilisateur. On les utilise couramment pour : 

from flask_wtf import FlaskForm
from wtforms import StringField
 
class RegisterForm(FlaskForm):
 
    lastname = StringField(label='Nom', default="DOE",
                           filters=[str.strip, str.upper],
                           description="Champ de saisie de votre nom")

Ci-dessus, on utilise les filtres pour retirer les espaces autour de la saisie et la passer en majuscules.

validators

Les validators permettent de contrôler la saisie de l'utilisateur. On les importe depuis wtforms.validators. 

from flask_wtf import FlaskForm
from wtforms import StringField
from wtforms.validators import DataRequired, Email
 
class RegisterForm(FlaskForm):
 
    email = StringField(label='Email', validators=[DataRequired(),Email()])

Ici on instancie deux validators pour contraindre la saisie de l'utilisateur :

Dans ce cas, peut également utiliser l'objet EmailField : 

from flask_wtf import FlaskForm
from wtforms import EmailField
 
 
class RegisterForm(FlaskForm):
 
    email = EmailField(label='Email')

Il existe de nombreux validators citons par exemple DataRequired, Length, Email, URL, NumberRange, IPAddress, MacAddress, Regexp, etc. Il est possible de définir ses propres validators.

Validation

C'est la fonction contrôleur qui se charge de valider le formulaire retourné en méthode POST

Références