<-

Retour

Symfony 6: Les Formulaires

Symfony 6: Les Formulaires

Les formulaires jouent un rôle essentiel dans les applications web, permettant aux utilisateurs d'interagir avec le système en saisissant et en soumettant des données.

En comprenant les concepts et les fonctionnalités des formulaires dans Symfony 6, vous serez en mesure de développer des applications web dynamiques et interactives.

0

Partager sur twitterPartager sur FacebookPartager sur LinkdinPartager sur Telegram

Plan du cours

  1. Introduction aux formulaires

    1. Importance des formulaires
    2. Avantages des formulaires Symfony

  2. Formulaires basiques

    1. Créer un formulaire
    2. Configuration des options
    3. Ajout de champs de formulaire
    4. Configuration des options et attributs
    5. Afficher le formulaire

  3. Création de formulaires avancée

    1. Création d'une classe Formulaire personnalisé
    2. Utilisation dans le contrôleur
    3. Gestion des données préremplies

  4. Validation des données de formulaire

    1. Utilisation des contraintes
    2. Définition de règles de validation

  5. Gestion de la soumission des formulaires

    1. Capture de la soumission
    2. Récupération et traitement des données
    3. Redirection après soumission

  6. Conclusion

Prérequis

Objectifs

À la fin de ce cours, vous serez capables de :


  1. Créer et personnaliser des formulaires avec Symfony 6.
  2. Valider les données saisies par les utilisateurs et gérer les erreurs de validation.
  3. Gérer la soumission des formulaires et traiter les données envoyées.

1. Introduction aux formulaires

1.1 Importance des formulaires

Les formulaires sont une composante clé des applications web, car ils permettent de collecter des informations et d'effectuer des opérations sur ces données.


Ils facilitent l'interaction entre l'utilisateur et l'application en offrant une interface conviviale pour saisir, valider et soumettre des données.


Que ce soit pour un simple formulaire de contact ou un formulaire complexe de création de compte, les formulaires sont omniprésents dans le développement web.


1.2 Avantages des formulaires Symfony

Symfony propose un composant dédié à la gestion des formulaires, offrant de nombreux avantages aux développeurs :


  • Facilité de création et de personnalisation :

    • Symfony fournit une API fluide et intuitive pour créer des formulaires à l'aide de la classe FormBuilder.
    • Les développeurs peuvent rapidement définir les champs, les options et les contraintes de validation des formulaires.

  • Validation intégrée et personnalisable :

    • Symfony offre un système de validation puissant et flexible.
    • Les contraintes de validation intégrées permettent de valider facilement les données saisies par les utilisateurs, tandis que les développeurs peuvent créer leurs propres contraintes personnalisées pour répondre aux besoins spécifiques de l'application.

  • Sécurité et protection contre les attaques CSRF :

    • Symfony intègre des mécanismes de sécurité pour protéger les formulaires contre les attaques de falsification de requête inter-sites (CSRF).
    • Cela garantit que les** formulaires** soumis proviennent bien de l'application elle-même.

  • Gestion avancée des données liées :

    • Symfony simplifie la gestion des relations entre entités dans les formulaires.
    • Il permet de créer facilement des champs imbriqués, des collections dynamiques et des formulaires évolutifs, offrant ainsi une grande flexibilité pour manipuler les données liées.

1.3 Installation du package

Afin de pouvoir utiliser les formulaires avec un projet Symfony, il faut d'abord télécharger et installer les dépendances nécessaires :


composer require symfony/form

2. Formulaire basique

Dans ce chapitre, nous allons explorer les bases de la création de formulaires dans Symfony 6 à l'aide de la classe FormBuilder.


Nous allons apprendre à configurer les options du formulaire, ajouter différents types de champs de formulaire tels que des champs de texte, des boutons et des cases à cocher, et enfin afficher le formulaire dans une vue Twig.


2.1 Créer un formulaire

Symfony 6 fournit la classe FormBuilder, qui permet de créer des formulaires de manière simple et structurée.


Le FormBuilder est généralement utilisé dans les contrôleurs Symfony pour générer des instances de formulaires.


Voici un exemple de création d'un formulaire basique à l'aide du FormBuilder :


<?php

use Symfony\Bundle\FrameworkBundle\Controller\AbstractController;
use Symfony\Component\HttpFoundation\Request;
use Symfony\Component\Routing\Annotation\Route;

class ContactController extends AbstractController{

  // Route pour envoyer un message
  #[Route('/contact', name:'contact')]
  public function contact()
  {
      // Objet pour construire un formulaire
      $formBuilder = $this->createFormBuilder();
  }
}

2.2 Configuration des options

Symfony 6 offre une grande flexibilité pour configurer les options du formulaire.


Vous pouvez spécifier des options telles que la méthode d'envoi (GET ou POST), l'action du formulaire, les attributs HTML supplémentaires, etc.


Voici un exemple de configuration des options du formulaire :


$formBuilder = $this->createFormBuilder()
    ->setMethod('POST')
    ->setAttributes([
        'class' => 'my-form-class',
    ]);

2.3 Ajout de champs

Les champs de formulaire représentent les éléments interactifs que les utilisateurs remplissent avec des données.


Symfony 6 fournit une variété de types de champs prédéfinis tels que les champs de texte, les cases à cocher, les boutons, etc., que vous pouvez ajouter à votre formulaire.


Voici un exemple d'ajout de différents types de champs de formulaire :


$formBuilder
    ->add('nom', TextType::class)
    ->add('email', EmailType::class)
    ->add('mot_de_passe', PasswordType::class)
    ->add('sexe', ChoiceType::class, [
        'choices' => [
            'Masculin' => 'm',
            'Féminin' => 'f',
        ],
        'expanded' => true,
    ])
    ->add('accepter_conditions', CheckboxType::class)
    ->add('envoyer', SubmitType::class);

2.4 Configuration des options et attributs

Symfony 6 offre de nombreuses options pour configurer individuellement chaque champ de formulaire.


Vous pouvez spécifier des options telles que l'étiquette du champ, les attributs HTML supplémentaires, les contraintes de validation, etc.


Voici un exemple de configuration des options et des attributs d'un champ :


$formBuilder->add('nom', TextType::class, [
    'label' => 'Nom complet',
    'attr' => [
        'placeholder' => 'Entrez votre nom complet',
        'class' => 'my-input-class',
    ],
    'required' => true,
]);

2.5 Afficher le formulaire

Une fois que vous avez créé et configuré votre formulaire, vous devez l'afficher dans une vue Twig pour qu'il soit visible par les utilisateurs.


Dans votre contrôleur, vous pouvez envoyer une instance construite du formulaire à votre vue :



// ...

#[Route('/contact')]
public function contact(Request $request){
  // Objet pour construire un formulaire
  $formBuilder = $this->createFormBuilder()
    ->setMethod('POST')
    ->setAttributes(['class' => 'my-form-class'])
    ->add('nom', TextType::class)
    ->add('email', EmailType::class)
    ->add('mot_de_passe', PasswordType::class)
    ->add('sexe', ChoiceType::class, [
        'choices' => [
            'Masculin' => 'm',
            'Féminin' => 'f',
        ],
        'expanded' => true,
    ])
    ->add('accepter_conditions', CheckboxType::class)
    ->add('envoyer', SubmitType::class);

  // Créer une instance du formulaire
  $formulaire = $formBuilder->getForm();

  return $this->render('contact.twig', ['formulaire'=> $formulaire]);
}

Voici comment afficher un formulaire dans une vue Twig :


{{ form(formulaire) }}

En utilisant cette fonction, Symfony génère automatiquement le code HTML nécessaire pour afficher le formulaire, y compris les balises <form>, les balises <input>, etc.


C'est ainsi que vous pouvez créer un formulaire basique en utilisant la classe FormBuilder et l'afficher dans une vue Twig dans Symfony 6.


Vous pouvez consulter la documentation officielle de Symfony pour voir plus d'exemples de type de champs.


3. Création de formulaires avancée

Dans ce chapitre, nous allons explorer des fonctionnalités avancées de la création de formulaires dans Symfony 6.


Nous allons apprendre à créer une classe de formulaire personnalisée, à l'utiliser dans un contrôleur et à gérer les données préremplies.


3.1 Création d'un Formulaire personnalisée

Lorsque vous souhaitez créer un formulaire avec des fonctionnalités spécifiques, vous pouvez créer une classe de formulaire personnalisée.


Cette approche vous permet de centraliser la logique de création et de gestion du formulaire dans une classe dédiée.


Voici comment créer une classe de formulaire personnalisée :


<?php
// src/Form/ContactFrom.php
namespace App\Form;
use Symfony\Component\Form\AbstractType;
use Symfony\Component\Form\FormBuilderInterface;
use Symfony\Component\Form\Extension\Core\Type as Types;

class ContactForm extends AbstractType
{
  public function buildForm(FormBuilderInterface $builder, array $options)
  {
    $builder
      ->setMethod('POST')
      ->setAttributes(['class' => 'my-form-class'])
      ->add('nom', Types\TextType::class)
      ->add('email', Types\EmailType::class)
      ->add('mot_de_passe', Types\PasswordType::class)
      ->add('sexe', Types\ChoiceType::class, [
          'choices' => [
              'Masculin' => 'm',
              'Féminin' => 'f',
          ],
          'expanded' => true,
      ])
      ->add('accepter_conditions', Types\CheckboxType::class)
      ->add('envoyer', Types\SubmitType::class);
  }
}

3.2 Utilisation du Formulaire personnalisée

Une fois que vous avez créé une classe de formulaire personnalisée, vous pouvez l'utiliser dans un contrôleur Symfony pour créer une instance du formulaire et l'afficher dans une vue Twig.


Voici comment utiliser la classe de formulaire dans le contrôleur :


#[Route('/utilisateur', name: 'utilisateur')]
public function utilisateur() {
  // Créer l'instance du formulaire
  $form = $this->createForm(ContactForm::class);

  // Envoyer l'instance à la vue
  return $this->render('utilisateur/utilisateur.twig', [
    'formulaire' => $form->createView(),
  ]);
}

3.3 Lier un objet avec le formulaire

Lorsque vous utilisez une classe de formulaire personnalisée, vous pouvez également lier un objet avec le formulaire.


Cela devient surtout intéressant quand l'objet est une entité, cela nous permettra de facilement irriguer l'instance de l'entité avec les données du formulaire.


Cela nous permettra aussi de préremplir les champs si l'entité a été irriguée depuis la base de données, lors de l'utilisation du formulaire pour la mise à jour des données, par exemple.


Imaginons que nous avons une classe Contact pour simuler une entité :


<?php
// dans /src/Classes/Contact.php
namespace App\Classes;
class Contact {
  private $nom = null;
  private $email = null;
  private $mot_de_passe = null;
  private $sexe = null;
  private $accepter_conditions = null;

  public function getNom() {
    return $this->nom;
  }

  public function setNom($valeur) {
    $this->nom = $valeur;
    return $this;
  }

  public function getEmail() {
    return $this->email;
  }

  public function setEmail($valeur) {
    $this->email = $valeur;
    return $this;
  }

  public function getSexe() {
    return $this->sexe;
  }

  public function setSexe($valeur) {
    $this->sexe = $valeur;
    return $this;
  }

  public function getAccepterConditions() {
    return $this->accepter_conditions;
  }

  public function setAccepterConditions($valeur) {
    $this->accepter_conditions = $valeur;
    return $this;
  }

  public function getMotDePasse(){
    return $this->mot_de_passe;
  }

  public function setMotDePasse($mot_de_passe): self{
    $this->mot_de_passe = $mot_de_passe;

    return $this;
  }
}

Voici comment lier un objet avec le formulaire :


// src/Controller/ContactController.php
  
// Code précédent ...

#[Route('/utilisateur', name: 'utilisateur')]
public function utilisateur() {
  // Intancier un objet de type Contact a lier au formulaire
  $contact = new Contact();

  // Préremplir les propriétés de l'objet $contact si nécessaire
  $contact->setNom('John Doe');

  // Créer le formulaire en le liant à l'objet Contact
  $form = $this->createForm(ContactFormType::class, $contact);

  // Envoyer l'instance à la vue
  return $this->render('utilisateur/utilisateur.twig', [
    'formulaire' => $form->createView(),
  ]);
}

Dans cet exemple, nous avons créé une instance de la classe Contact et l'avons passée comme deuxième argument à la méthode $this->createForm().


Cela lie l'objet $contact avec le formulaire, ce qui permet de préremplir les champs avec les valeurs de l'objet et de relier les données soumises à l'objet lors de la soumission du formulaire.


Vous pouvez préremplir les propriétés de l'objet $contact en fonction de vos besoins avant de créer le formulaire.


4. Validation des données

Lorsque vous travaillez avec des formulaires, il est essentiel de valider les données soumises pour garantir leur intégrité et leur conformité aux règles métier de votre application.


Dans ce chapitre, nous allons explorer les fonctionnalités de validation intégrées de Symfony 6 et apprendre à définir des règles de validation pour les champs de formulaire.


Pour installer le paquet, lancez cette commande :


composer require symfony/validator

4.1 Utilisation des contraintes intégrées

Symfony propose un ensemble de contraintes de validation intégrées qui vous permettent de spécifier les règles de validation pour chaque champ de votre formulaire.


Ces contraintes permettent de vérifier les types de données, les longueurs, les formats, etc.


Vous pouvez choisir parmi une variété de contraintes prédéfinies, ou créer vos propres contraintes personnalisées.


Voici quelques exemples de règles de validation couramment utilisées :


  • NotBlank : Vérifie que le champ n'est pas vide.
  • Email : Vérifie que le champ est une adresse e-mail valide.
  • Length : Vérifie la longueur minimale et maximale du champ.
  • Regex : Vérifie que la valeur du champ correspond à une expression régulière donnée.

Vous pouvez consulter la documentation officielle de Symfony pour voir plus d'exemples sur la validation.


Vous pouvez combiner plusieurs contraintes pour définir des règles de validation complexes.


Voici comment utiliser les contraintes de validation intégrées dans un formulaire :



// Code précedent ...

// Import des validateur de symfony installée
use Symfony\Component\Validator\Constraints as Assert;

class ContactFormType extends AbstractType
{
  public function buildForm(FormBuilderInterface $builder, array $options)
  {
    $builder
        // Code précédent

      ->add('name', TextType::class, [
          'constraints' => [ 
              new Assert\NotBlank(), 
              new Assert\Length(['min' => 2, 'max' => 255]), 
          ],
      ])
  }
}

4.2 Utilisation de messages personnalisés

Vous pouvez également préciser le message à afficher lorsque la validation échoue :



// Code précédent

->add('nom', TextType::class, [
    'constraints' => [ 
        new Assert\NotBlank([ 'message' => 'Le champ "Nom" ne peut pas être vide.' ]), 
        new Assert\Length([ 
            'min' => 2, 
            'max' => 255, 
            'minMessage' => 'Le champ "Nom" doit contenir au moins {{ limit }} caractères.', 
            'maxMessage' => 'Le champ "Nom" ne peut pas dépasser {{ limit }} caractères.', 
        ]), 
    ],
])

Dans cet exemple, nous avons personnalisé les messages d'erreur pour les contraintes NotBlank et Length appliquées au champ name.


Vous pouvez utiliser des messages d'erreur statiques ou inclure des variables dynamiques, telles que {{ limit }}, pour afficher des messages plus précis.


Vous pouvez consulter la documentation officielle de Symfony pour voir plus d'exemples de contraintes.


5. Gestion de la soumission

La gestion de la soumission des formulaires est une étape cruciale dans le processus de traitement des données envoyées par l'utilisateur.


Dans ce chapitre, nous allons voir comment capturer la soumission d'un formulaire dans un contrôleur Symfony, récupérer et traiter les données envoyées, effectuer des actions telles que la redirection et afficher des messages de confirmation à l'utilisateur.


5.1 Capture de la soumission

Pour capturer la soumission d'un formulaire dans un contrôleur Symfony, vous devez utiliser la méthode handleRequest() sur l'objet Request pour lier les données du formulaire soumis à l'objet de formulaire correspondant.


Voici comment capturer la soumission du formulaire dans un contrôleur :


// Code Précédent ...

#[Route('/utilisateur', name: 'utilisateur')]
public function utilisateur(Request $req) {
  // Intancier un objet de type Contact a lier au formulaire
  $contact = new Contact();

  // Préremplir les propriétés de l'objet $contact si nécessaire
  $contact->setNom('John Doe');

  // Créer le formulaire en le liant à l'objet Contact
  $form = $this->createForm(ContactForm::class, $contact);

  // Charger le formulaire avec les données de la requpete
  $form -> handleRequest($req);

  // Vérification si le formulaire a été soumis et est valide
  if ($form->isSubmitted() && $form->isValid()) {
    // Récupérer les données du formulaire manuellement
    $email = $form->get('email');
    $nom = $form->get('nom');

    // L'objet contact est irrigué automatiquement
    dump($contact);
  }

  // Envoyer l'instance à la vue
  return $this->render('utilisateur/utilisateur.twig', [
    'formulaire' => $form->createView(),
  ]);
}

5.2 Redirection après soumission

Après avoir traité les données du formulaire, il est courant de rediriger l'utilisateur vers une autre page, telle qu'une page de confirmation ou une page d'accueil.


Symfony facilite la redirection en utilisant la méthode redirectToRoute().


Voici comment effectuer une redirection après la soumission du formulaire dans un contrôleur :


// Code précédnent ...

if ($form->isSubmitted() && $form->isValid()) {
  // Traitement des données du formulaire

  // Redirection vers une autre page
  return $this->redirectToRoute('accueil');
}

conclusion

Ce cours sur les formulaires avec Symfony 6 vous a permis de découvrir les concepts essentiels et les fonctionnalités clés pour créer et gérer des formulaires dans vos applications web.


Vous avez appris à :


  • Créer et personnaliser des formulaires avec Symfony 6 en utilisant la classe FormBuilder.
  • Valider les données saisies par les utilisateurs en utilisant les contraintes de validation intégrées de Symfony.
  • Gérer la soumission des formulaires dans un contrôleur Symfony en capturant les données et en effectuant des actions appropriées.
  • Afficher les formulaires dans des vues Twig et personnaliser leur rendu en utilisant des attributs HTML supplémentaires.
  • Utiliser des fonctionnalités avancées des formulaires Symfony, telles que les champs imbriqués, les collections et les formulaires évolutifs.
  • Préremplir les champs de formulaire en liant un objet à votre formulaire.
  • Effectuer des redirections après soumission et afficher des flash messages pour informer l'utilisateur.

Il est important de continuer à explorer les fonctionnalités avancées des formulaires Symfony pour enrichir vos compétences en développement web:



Aller plus loin

Dans le prochain cours, nous aborderons l'authentification avec Symfony.

Nous explorerons les différentes méthodes d'authentification disponibles, la gestion des utilisateurs, la sécurité des mots de passe et bien plus encore.

Ce cours vous permettra de sécuriser vos applications Symfony en mettant en place des mécanismes d'authentification solides.

Précedent: Symfony 6: Les vues Twig
Suivant: Symfony 6: L'authentification

Commentaires

IsLoading

Symfony 6: Initiation

Au cours de cette série, vous découvrirez les concepts fondamentaux de Symfony 6, tels que la gestion des routes, la manipulation des bases de données, l'authentification et l'autorisation, la création de formulaires, ainsi que l'intégration de composants tiers populaires tels que Doctrine et Twig.



Niveau:
Symfony 6: InitiationSymfony 6: InitiationSymfony 6: InitiationSymfony 6: InitiationSymfony 6: Initiation

PHP

Initiation

Bases

Web

Programmation

Album

Symfony 6: Introduction

Ce support de cours vous fournira une introduction complète au Framework Symfony.

Vous découvrirez comment installer et configurer Symfony sur votre machine, ainsi que les principes fondamentaux, son architecture et la manière de configurer votre environnement de développement.

Niveau:
Symfony 6: IntroductionSymfony 6: IntroductionSymfony 6: IntroductionSymfony 6: IntroductionSymfony 6: Introduction

PHP

Symfony

Initiation

Bases

Web

Programmation

Introduction

Symfony 6: Les Contrôleurs

Ce support de cours vous introduira aux contrôleurs dans le contexte du développement web avec le Framework Symfony.

Vous apprendrez comment créer, configurer et utiliser des contrôleurs pour interagir avec les utilisateurs, traiter les données et générer des réponses dynamiques.

Niveau:
Symfony 6: Les ContrôleursSymfony 6: Les ContrôleursSymfony 6: Les ContrôleursSymfony 6: Les ContrôleursSymfony 6: Les Contrôleurs

PHP

Symfony

Initiation

Bases

Contrôleur

Web

Programmation

Introduction

Symfony 6: ORM Doctrine

Ce support de cours mettra l'accent sur la gestion des bases de données avec Symfony.

Vous apprendrez à configurer et à utiliser Doctrine, l'ORM (Object-Relational Mapping) de Symfony, pour interagir avec votre base de données.

Niveau:
Symfony 6: ORM DoctrineSymfony 6: ORM DoctrineSymfony 6: ORM DoctrineSymfony 6: ORM DoctrineSymfony 6: ORM Doctrine

PHP

Symfony

Initiation

Bases

ORM

Doctrine

Web

Programmation

Serveur

Symfony 6: Les vues avec twig

Dans cette partie du cours, nous allons explorer les vues et les templates TWIG, un moteur de templates puissant et flexible utilisé dans le Framework Symfony.

En comprenant ces concepts, vous serez en mesure de créer des interfaces utilisateur interactives et esthétiques pour vos applications Symfony.

Niveau:
Symfony 6: Les vues avec twigSymfony 6: Les vues avec twigSymfony 6: Les vues avec twigSymfony 6: Les vues avec twigSymfony 6: Les vues avec twig

PHP

Symfony

Initiation

Bases

View

Twig

Web

Programmation

Serveur

Symfony 6: Authentification

Ce cours d'initiation à la programmation avec Symfony 6 se concentre sur l'authentification et l'autorisation, deux aspects essentiels de la sécurité des applications web.

Vous apprendrez à mettre en place un système d'authentification sécurisé pour gérer l'accès des utilisateurs à votre application et à contrôler leurs permissions.

Niveau:
Symfony 6: AuthentificationSymfony 6: AuthentificationSymfony 6: AuthentificationSymfony 6: AuthentificationSymfony 6: Authentification

PHP

Symfony

Initiation

Bases

Formulaires

Authentification

Web

Programmation

Serveur

D

CompétencesContactsArticlesProjets
contacte par tel

www.djemai-samy.com

contacte par tel

samy.djemai93@gmail.com

contacte par tel

+33 7 54 56 19 90