wikinotes

Outils pour utilisateurs

Outils du site

Piste : • gerer_connexions_via_networkmanager
dev:python:flask:flask_formulaires_wtforms

Différences

Ci-dessous, les différences entre deux révisions de la page.

Lien vers cette vue comparative

Les deux révisions précédentesRévision précédente
Prochaine révision		Révision précédente
dev:python:flask:flask_formulaires_wtforms [2025/02/28 11:01] – yoanndev:python:flask:flask_formulaires_wtforms [2025/03/09 13:57] (Version actuelle) – yoann
Ligne 9: Ligne 9:
 Ici on utilise le paquet Flask-WTF qui intègre la bibliothèque WTForms au micro framework Flask.  Ici on utilise le paquet Flask-WTF qui intègre la bibliothèque WTForms au micro framework Flask. 
  
 +===== Initialiser l'application Flask =====
  
-Initialisation du projet :+Création d'un dépôt git pour le projet et initialisation de l'application Flask :
  
 <code bash> <code bash>
Ligne 17: Ligne 18:
 git branch -m main git branch -m main
  
-# Création de l'environnement et installation des modules+# Création de l'environnement et installation des packages
 python3 -m venv venv python3 -m venv venv
 source venv/bin/activate source venv/bin/activate
Ligne 64: Ligne 65:
  
 A ce stade la commande doit lancer le serveur web et afficher un message du type : A ce stade la commande doit lancer le serveur web et afficher un message du type :
 +
 <file> <file>
 * Serving Flask app 'helloforms' * Serving Flask app 'helloforms'
Ligne 81: Ligne 83:
  
 Pour la mise en forme, on utilise le framework Spectre CSS Pour la mise en forme, on utilise le framework Spectre CSS
 +
 +
 +===== Création du formulaire =====
 +
 +  * Pour créer un formulaire, on définit une classe héritant de **FlaskForm**.
 +  * Chaque attribut de la notre classe représentant un champ de formulaire sera un objet héritant de la classe de base ''wtforms.fields.Field'' ;
 +  * L'objet de type formulaire est instancié et traité par le contrôleur (la fonction associée à la route Flask) et transmis à la vue (le template).
 +
 +
 +<code python>
 +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')
 +</code>
 +
 +Comme illustré ci-dessus, le constructeur des objets héritant de la classe de base ''wtforms.fields.Field'' accepte notamment les paramètres :
 +  * ''label'' : le label associé au champ ;
 +  * ''default'' : valeur par défaut du champ, peut être un ''callable'' (un nom de fonction exécutable) ;
 +  * ''description'' : une description associée au champ, utilisée généralement par les help text ;
 +  * ''filters'' : tableau, séquence de ''callable'' exécutés pour traiter les données du champ ;
 +  * ''validators'' : tableau de validators appelés lors de l'exécution de ''validate''.
 +
 +
 +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 :
 +
 +  * **StringField** : Champ type texte ;
 +  * **TextAreaField** :
 +  * **SelectField** : 
 +  * **BooleanField** : Champ de type checkbox ;
 +  * **PasswordField**  : Champ de saisie de mot de passe
 +  * **HiddenField** : Champ masqué ;
 +  * **SubmitField** : Bouton soumission du formulaire ;
 +
 +
 +Champs plus spécifiques :
 +  * **EmailField** ;
 +  * **TelField** ;
 +  * **URLField** ;
 +  * **TimeField** ;
 +  * **ColorField** ; 
 +  * **IntegerField** : Saisie d'un nombre entier;
 +  * **IntegerRangeField**
 +  * **FloatField** 
 +  * **DecimalRangeField** ;
 +  * **FileField**
 +
 +
 +
 +===== filters =====
 +
 +Les filtres permettent de traiter (en amont de la validation), les valeurs saisies par l'utilisateur. On les utilise couramment pour :
 +
 +  * Retirer les espaces en début et fin de saisie ;
 +  * Passer la saisie en majuscule, en minuscule ;
 +  * Arrondir etc.
 +
 +
 +<code python>
 +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")
 +
 +</code>
 +
 +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''.
 +
 +
 +<code python>
 +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()])
 +</code>
 +
 +Ici on instancie deux validators pour contraindre la saisie de l'utilisateur :
 +  * Le champs ne doit pas être vide,
 +  * La saisie doit respecter le formalisme d'un email.
 +
 +Dans ce cas, peut également utiliser l'objet EmailField : 
 +
 +<code python>
 +from flask_wtf import FlaskForm
 +from wtforms import EmailField
 +
 +
 +class RegisterForm(FlaskForm):
 +
 +    email = EmailField(label='Email')
 +</code>
 +
 +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.
 +
 +  * Ici la [[https://wtforms.readthedocs.io/en/3.2.x/validators/|documentation exhaustive des validators WTForms]]
 +
 +===== Validation =====
 +
 +C'est la fonction contrôleur qui se charge de valider le formulaire retourné en méthode POST
 +
  
 ===== Références ===== ===== Références =====
Ligne 91: Ligne 212:
   * Vidéo [[https://youtu.be/HvEkVffiNXQ| Créer des formulaires avec Flask-WTF]]   * Vidéo [[https://youtu.be/HvEkVffiNXQ| Créer des formulaires avec Flask-WTF]]
   * https://picturepan2.github.io/spectre/getting-started.html   * https://picturepan2.github.io/spectre/getting-started.html
 +  * https://spectre-org.github.io/spectre-docs/docs/layout/
  
  
dev/python/flask/flask_formulaires_wtforms.1740740485.txt.gz · Dernière modification : 2025/02/28 11:01 de yoann

Outils de la page

Sauf mention contraire, le contenu de ce wiki est placé sous les termes de la licence suivante : GNU Free Documentation License 1.3
GNU Free Documentation License 1.3 Donate Powered by PHP Valid HTML5 Valid CSS Driven by DokuWiki