8 Interagissez Avec Vos Utilisateurs - Construisez Un Site Web À L'aide Du Framework Symfony 5 - OpenClassrooms

18/07/2022 07:15 Interagissez avec vos utilisateurs - Construisez un site web à l’aide du framework Symfony 5 - OpenClassrooms
Accueil > Cours > Construisez un site web à l’aide du framework Symfony 5 > Interagissez avec vos utilisateurs
Construisez un site web à l’aide du framework Symfony 5
20 heures  Moyenne
Mis à jour le 08/07/2022
 
Interagissez avec vos utilisateurs
Créez votre premier formulaire

Nous interagissons principalement avec nos utilisateurs à l'aide de formulaires : que ce soit pour la recherche, la demande d'informations, ou l'ajout d'un
un site e-commerce, par exemple. Le framework Symfony vous permet de créer, valider et rendre des formulaires HTML avec le moteur de gabarit Twig.
Imaginons un formulaire de création d'articles pour un blog. Au plus simple, pour un article, nous souhaitons un titre, un contenu principal, un nom d'au
sous forme d'objet :
<?php
// src/Entity/Article.php
namespace App\Entity;
class Article
{
private $author;
private $content;
private $title;
public function getAuthor()

{
return $this->author;
}
public function setAuthor($author)

{
$this->author = $author;
}
// ...
}
https://openclassrooms.com/fr/courses/5489656-construisez-un-site-web-a-l-aide-du-framework-symfony-5/5517026-interagissez-avec-vos-utilis… 1/13
Cet objet n'est pas lié à Symfony, il correspond à votre besoin métier.
Comment créer un formulaire, alors ? Il va falloir créer un "type de formulaire" à partir de notre objet.
Création du formulaire
Un type de formulaire est une classe qui permet de construire un formulaire en définissant les différents types de champs. Voici un exemple valide de ty
précédent :
<?php
// src/Form/ArticleType.php
namespace App\Form;
use App\Entity\Article;
use Symfony\Component\Form\AbstractType;
use Symfony\Component\Form\FormBuilderInterface;
use Symfony\Component\OptionsResolver\OptionsResolver;
use Symfony\Component\Form\Extension\Core\Type\TextType;
use Symfony\Component\Form\Extension\Core\Type\TextareaType;
class ArticleType extends AbstractType

{
public function buildForm(FormBuilderInterface $builder, array $options)
{
$builder
->add('title')
->add('content', TextareaType::class)
->add('author', TextType::class)
;
}
public function configureOptions(OptionsResolver $resolver)

{
$resolver->setDefaults([
'data_class' => Article::class,
]);
}
}
La création d'un formulaire à partir d'un objet est plutôt simple pour deux raisons principales :
1. le composant Form dispose d'un constructeur de formulaires (le form builder) capable de générer tout type de formulaire à partir de champs qu'il
texte, de type date...) ;
2. en passant la classe au résolveur d'options du formulaire, le constructeur de formulaires est capable - à partir de la classe - de deviner quel type de
exemple, si une classe a une propriété de type DateTime, alors le champ utilisé sera de type datetime en HTML.
Par défaut, le type de champ rendu sera un champ "texte" qui correspond à la classe TextType, mais on peut évidemment définir pour chaque propriété
souhaite.
Les différents types de champs

Tous les types de champs disponibles dans la spécification HTML5 sont disponibles dans le composant ; ils couvriront l'essentiel des besoins de votre app
Par « type de champ », il ne faut pas comprendre « type HTML » comme text , password ou select, mais comprendre « type sémantique ». Par exem
aussi afficher trois champs HTML select à la suite pour choisir le jour, le mois et l'année. Il existe aussi un type TimezoneType pour choisir le fuseau
mal et ils n'ont rien à voir avec les types HTML ; ils vont bien plus loin que ces derniers !
Voici la liste des types de formulaires disponibles, assurez-vous de choisir un type de champ cohérent avec la propriété de l'objet correspondant :
Texte Choix Date et temps Divers Multiple Caché
TextType ChoiceType DateType CheckboxType CollectionType HiddenTy

TextareaType
EntityType DateIntervalType FileType RepeatedType
EmailType
IntegerType CountryType DatetimeType RadioType
MoneyType
NumberType LanguageType TimeType
PasswordType
LocaleType BirthdayType
PercentType
SearchType TimezoneType
UrlType
CurrencyType
TelType
RangeType
ColorType
Chacun de ces types de formulaires possède de nombreuses options qui permettent encore de configurer l'affichage. Par exemple, chaque type de cha
qui permet d'afficher un message d'aide lié au champ de formulaire (ce qui est une bonne pratique).
<?php
$builder->add('title', null, [
'help' => "Le titre de l'article, utilisé dans l'url",
]);
Utilisation et rendu à l'aide de Twig

Pour afficher le formulaire dans un template Twig, il va falloir le créer dans un contrôleur et fournir à Twig une "représentation" de l'objet formulaire créé
<?php
// src/Controller/FormController.php
namespace App\Controller;
use Symfony\Bundle\FrameworkBundle\Controller\AbstractController;
use Symfony\Component\HttpFoundation\Request;
use Symfony\Component\Routing\Annotation\Route;
use App\Form\ArticleType;
class FormController extends AbstractController

{
/**
* @Route("/form/new")
*/
public function new(Request $request)
{
$article = new Article();
$article->setTitle('Hello World');
$article->setContent('Un très court article.');
$article->setAuthor('Zozor');
$form = $this->createForm(ArticleType::class, $article);
return $this->render('default/new.html.twig', array(

'form' => $form->createView(),
));
}
}
Et le template Twig correspondant :
{# templates/default/new.html.twig #}
{{ form(form) }}
Et en accédant à l’URL correspondante, voici un exemple de rendu :
Rendu d'un formulaire avec Twig
Ce n'est pas très joli, mais c'est fonctionnel ! Et nous améliorerons cela très bientôt.
Validez vos formulaires simplement

Jusque là, nous avons affiché un nouveau formulaire, mais il n'est même pas possible de le soumettre (pas de bouton "Créer") et les données seront de t
contrôleur.
Soumettez un formulaire et traitez les données reçues

Tout d'abord, le plus simple est l'ajout d'un bouton de type "submit".
Dans le gabarit Twig, nous allons adapter le rendu du formulaire et ajouter un bouton. Nous reviendrons sur les fonctions utilisées un peu plus tard :
{# templates/default/new.html.twig #}
<html>
<head></head>
<body>
{{ form_start(form) }}
{{ form_row(form.title) }}
{{ form_row(form.content) }}
{{ form_row(form.author) }}
<button type="submit" class="btn btn-primary">Créer</button>

{{ form_end(form) }}
</body>
</html>
Pour le rendu suivant:
Un formulaire que l'on peut enfin soumettre
Et mettons à jour notre contrôleur Symfony afin de récupérer les données reçues de la requête, et spécifiquement à partir du formulaire soumis :
<?php
// src/Controller/FormController.php
/**
* @Route("/form/new")
*/
public function new(Request $request)
{
$article->setTitle('Hello World');
$article->setContent('Un très court article.');
$article->setAuthor('Zozor');
$form = $this->createForm(ArticleType::class, $article);
$form->handleRequest($request);
if ($form->isSubmitted() && $form->isValid()) {

dump($article);
}
return $this->render('default/new.html.twig', array(

'form' => $form->createView(),
));
}
Tout d'abord, nous mettons à jour le formulaire à l'aide des informations reçues de l'utilisateur : c'est le rôle de la fonction handleRequest().
Ensuite, nous vérifions que le formulaire a bien été soumis ($form->isSubmitted()) et qu'il est valide ($form->isValid()).
Enfin, nous pouvons manipuler notre article mis à jour avec les données du formulaire. En utilisant le WebProfiler, on accède aux données provenant du
Les données de l'article ont bien été mises à jour
Une bonne chose de faite, n'est-ce pas ?
Nous nous préoccuperons de la sauvegarde en base de données dans un prochain chapitre.
Pour l'instant, concentrons-nous sur quelque chose de vraiment important concernant les formulaires : la validation des données et l'envoi d'erreurs à
Validez un formulaire avec le composant Validator

La validation des formulaires est l'une des tâches les plus pénibles pour un développeur web. Le framework Symfony et son composant Validator simplifi
Vous aurez remarqué, dans le contrôleur précédemment mis à jour, que nous avons utilisé la fonction isValid() associée au formulaire.
Eh bien, dès lors que des règles de validation ont été définies, les formulaires sont capables d'utiliser le validateur automatiquement ! Dans notre cas, no
de règles de validation, alors notre formulaire est forcément valide.
La meilleure façon de définir un ensemble de règles à valider par le formulaire est d'utiliser les annotations fournies par le composant Validator au nivea
<?php
// src/Entity/Article.php
namespace App\Entity;
use Symfony\Component\Validator\Constraints as Assert;
class Article
{
/**
* @Assert\Length(
* min = 10,
* max = 70,
* minMessage = "Ce titre est trop court",
* maxMessage = "Ce titre est trop long"
* )
*/
private $title;
/**
* @Assert\NotBlank(message = "Le contenu ne peut être vide.")
*/
private $content;
/**
* @Assert\NotBlank(message = "Un auteur doit être associé à l'article")
*/
private $author;
/* ... */
}
La validation - comme pour la gestion de nos URL - se déclare à l'aide d'annotations, en associant des contraintes de validation à des propriétés ou des m
objets.
Toutes les contraintes de validation ont une propriété message qui permet de redéfinir le message d'erreur qui sera retourné. Avant d'aller plus en détai
de validation à votre disposition, regardons comment fonctionne le validateur de Symfony.
Le validateur en bref
Le composant Validator de Symfony permet de créer un validateur :
<?php
use Symfony\Component\Validator\Validation;
use Symfony\Component\Validator\Constraints\Length;
use Symfony\Component\Validator\Constraints\NotBlank;

$validator = Validation::createValidator();
$violations = $validator->validate($article, [
new Length(['min' => 10]),
new NotBlank(),
]);
if (0 !== count($violations)) {
// Affiche les erreurs
foreach ($violations as $violation) {
echo $violation->getMessage().'<br>';
}
}
Tout d'abord, la classe Validation du composant permet de créer une instance du validateur. Ce validateur a une méthode validate qui prend 2 argumen
la valeur à valider : ce peut être une chaîne de caractères, un tableau ou un objet ;

une collection de contraintes de validation.
Le résultat de cette fonction est une liste de violations qui permettent d'accéder aux messages d'erreurs correspondant aux contraintes qui n'ont pas été
valide, alors la liste de violations est vide.
Dans un contrôleur, le validateur est accessible en utilisant l'interface ValidatorInterface.
Lorsque nous soumettons notre formulaire et que nous appelons la fonction isValid du formulaire Symfony, les contraintes de validation déclarées dans
appliquées sur l'objet $article qui a été retrouvé à partir des données de la requête utilisateur.
Les contraintes de validation

Il existe de nombreuses contraintes de validation et il est possible d'en créer de nouvelles assez facilement. Voici la liste exhaustive des contraintes de va
Symfony :
Basique Texte Comparaison Date
NotBlank Email EqualTo Date

NotEqualTo DateTime
Blank Length
IdenticalTo Time
NotNull Url NotIdenticalTo
LessThan
IsNull Regex LessThanOrEqual
GreaterThan
IsTrue Ip
GreaterThanOrEqual
IsFalse Uuid Range
Type
Collection Fichier Nombres / Finances Autres
Choice File Bic Callback
Collection Image CardScheme Expression
Count Currency All
UniqueEntity Luhn UserPassword
Language Iban Valid
Locale Isbn
Country Issn
Retournez les erreurs à l'utilisateur

Maintenant que l'on a configuré le contrôleur et la classe Article pour valider les données envoyées par l'utilisateur, validons le formulaire :
Une validation inattendue...
Par défaut et en fonction des règles de validation configurées, le formulaire va appliquer certaines règles de validation HTML5 ; par exemple, voici le HTM
"Title" :
<input
type="text"
id="article_title"
name="article[title]"
maxlength="70"
pattern=".{10,}"
class="form-control"
value="Hello World"
>
La bonne nouvelle est que le serveur n'est pas appelé en cas d'erreur utilisateur ; la mauvaise est que, puisque le serveur n'est pas appelé, les messages q
pas accessibles...
Si la gestion des messages d'erreur est importante pour vous, une solution est de désactiver la validation HTML5 avec l'attribut "novalidate". Mettons à jo
<html>
<head></head>
<body>
{{ form_start(form, {'attr': {'novalidate': 'novalidate'}}) }}
{{ form_row(form.title) }}
{{ form_row(form.content) }}
{{ form_row(form.author) }}

</body>
</html>
Et soumettons un formulaire invalide :
Oups ! Un article sans contenu n'est pas une bonne idée...
Ce n'est vraiment pas joli, mais fonctionnel ! Maintenant que nous avons une gestion de formulaires complète, occupons-nous de rendre cela un minim
Customisez le rendu de vos formulaires

Revenons sur le gabarit utilisé pour générer notre formulaire : il utilise de nombreuses fonctions Twig.
Mais que font exactement ces fonctions ?
Utilisez Twig pour construire vos formulaires

Le framework Symfony fournit une intégration de Twig avec le composant Form, sous forme de fonctions dédiées au rendu de vos formulaires.
Les fonctions de Twig dédiées au composant Form
form_start rend la balise <form> : on peut définir l'action, l'attribut method et ajouter différents attributs à la balise ;
form_row rend un champ de formulaire complet, label et messages d'erreurs compris ;
form_label rend le label ;
form_widget rend l'input ;
form_errors rend le bloc d'erreurs ;
form_rest rend tous les champs non encore rendus ;
csrf_token rend un input hidden avec une clé contre les attaques de type CSRF ;
form_end rend la balise fermante </form> .
Avec l'ensemble de ces fonctions, nous pouvons construire n'importe type de formulaire qui sera rendu en fonction du thème actif.
Attends, là, c'est quoi un thème de formulaire ?
Utilisez un thème de formulaire

Un thème de formulaire est un gabarit qui contient toutes des définitions, tous les gabarits pour chaque type de formulaire géré par votre application. E
utilisons déjà un thème de formulaire, à savoir le fichier form_div_layout.html.twig fourni avec le framework Symfony 4 :
...
{%- block checkbox_widget -%}

<input type="checkbox" {{ block('widget_attributes') }}{% if value is defined %} value="{{ value }}"{% endif %}{% if checked %} check
{%- endblock checkbox_widget -%}
{%- block radio_widget -%}

<input type="radio" {{ block('widget_attributes') }}{% if value is defined %} value="{{ value }}"{% endif %}{% if checked %} checked=
{%- endblock radio_widget -%}
{%- block datetime_widget -%}

{% if widget == 'single_text' %}
{{- block('form_widget_simple') -}}
{%- else -%}
<div {{ block('widget_container_attributes') }}>
{{- form_errors(form.date) -}}
{{- form_errors(form.time) -}}
{{- form_widget(form.date) -}}
{{- form_widget(form.time) -}}
</div>
{%- endif -%}
{%- endblock datetime_widget -%}
...
Pour chaque type de formulaire livré avec Symfony, un thème de formulaire définit comment il doit être rendu en Twig. Ce n'est pas tout ! Par défaut, vo
4 plusieurs thèmes :
Bootstrap 3 ;
Bootstrap 4 ;
et Foundation 5.
Commençons par activer le thème de formulaire pour Bootstrap 4 et par ajouter le fichier CSS correspondant.
D'abord, il va falloir mettre à jour la configuration du framework pour activer le thème Bootstrap 4 :
# config/packages/twig.yaml
twig:
debug: '%kernel.debug%'
strict_variables: '%kernel.debug%'
form_themes: ['bootstrap_4_layout.html.twig'] # accepte plusieurs thèmes
Maintenant que le thème est activé, mettons le gabarit du formulaire à jour en ajoutant Bootstrap 4 :
{# /templates/form/new_article.html.twig #}
<html>
<head>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css">
</head>
<body>
<div class="container">
<div class="row">
{{ form_start(articleForm, {
'attr': {
'novalidate': 'novalidate',
'class': 'col-lg-5'
}
})
}}
{{ form_row(articleForm.title) }}
{{ form_row(articleForm.content) }}
{{ form_row(articleForm.author) }}
{{ form_row(articleForm.publicationDate) }}

{{ form_end(articleForm) }}
</div>
</div>
</body>
</html>
Voici maintenant à quoi ressemble notre formulaire :
Formulaire après activation du thème Bootstrap 4
C'est déjà beaucoup mieux, non ?
Vous l'aurez compris : une fois votre thème de formulaire parfaitement adapté à votre besoin activé, l'intégration de vos formulaires sera rapide et homo
application !
Customisation d'un champ spécifique dans un gabarit

Il arrivera que nous ayons besoin de customiser l'affichage d'un champ particulier. Dans ce cas, il va falloir redéfinir le gabarit utilisé pour ce champ préc
formulaire concerné.
Imaginons le formulaire d'un produit qui a 2 champs : prix et nom. Nous voulons, pour le prix, afficher un message d'information complémentaire à côté
Il va falloir alors customiser uniquement ce "fragment" :
{% form_theme productForm _self %}
{% block _product_price_widget %}
<div class="price_widget">
{{ block('form_widget_money') }}
<i>Des frais de transaction seront ajoutés.</i>
</div>
{% endblock %}
{{ form_widget(productForm.price) }}
Pour définir l'exact nom du fragment, il faut prendre le nom du formulaire (par exemple, pour la classe "ProductType" , c'est "product" , qui peut être redé
méthode getName() du type de formulaire) suivi du nom du champ, ici le champ "price".
On peut aussi le retrouver à partir de l'attribut "name" du champ HTML généré, qui vaudra product[price], ici.
Encore plus loin, intégrer un formulaire qui génère une collection de formulaires
La customisation d'un formulaire qui permet de créer une liste de sous-formulaires peut être difficile à appréhender. Imaginons un produit de type "Cha
associer différentes pointures.
Nous aurions donc un objet "Chaussure" qui aurait une propriété "pointures" qui serait une collection d'objets de type "Pointure", eux-mêmes n'ayant qu
<?php
namespace App\Form\Type;
use App\Model\Shoe;
use Symfony\Component\Form\AbstractType;
use Symfony\Component\Form\Extension\Core\Type\CollectionType;
use Symfony\Component\Form\Extension\Core\Type\MoneyType;
use Symfony\Component\Form\Extension\Core\Type\SubmitType;
use Symfony\Component\Form\FormBuilderInterface;
use Symfony\Component\OptionsResolver\OptionsResolver;
class ShoeType extends AbstractType

{
/**
* {@inheritdoc}
*/
public function buildForm(FormBuilderInterface $builder, array $options)
{
$builder
->add('name')
->add('description')
->add('price', MoneyType::class)
->add('sizes', CollectionType::class, [
'entry_type' => SizeType::class,
'entry_options' => ['label' => false],
'allow_add' => true,
'allow_delete' => true,
])
->add('save', SubmitType::class)
;
}
/**
* {@inheritdoc}
https://openclassrooms.com/fr/courses/5489656-construisez-un-site-web-a-l-aide-du-framework-symfony-5/5517026-interagissez-avec-vos-utili… 10/13
*/
public function configureOptions(OptionsResolver $resolver)
{
$resolver->setDefaults([
'data_class' => Shoe::class,
]);
}
}
Voici le gabarit correspondant :
{{ form_start(shoe) }}
{{ form_row(shoe.name) }}
<h3>Sizes</h3>
<ul class="sizes">
{% for size in shoe.sizes %}
<li>{{ form_row(size.value) }}</li>
{% endfor %}
</ul>
Si le formulaire a été configuré pour l'ajout de nouvelles pointures, alors le formulaire recevra une variable "prototype" avec le formulaire correspondant.
JavaScript pour construire de nouveaux formulaires.
Par exemple :
<ul class="sizes" data-prototype="{{ form_widget(shoe.sizes.vars.prototype)|e('html_attr') }}">

...
</ul>
Vous pourrez trouver un exemple de code fonctionnel sur jsfiddle.net ou encore dans la documentation officielle. D'ailleurs, le prochain chapitre de ce co
d'expérimenter ce cas d'utilisation !
Exercice : intégration d'un formulaire complexe
 Console de code
À votre tour de coder

Mettez immédiatement en application ce que vous avez
appris.
Vous êtes libre de vous tromper et de réessayer autant que vous
le souhaitez.
JE CODE MAINTENANT !
JE NE PEUX PAS, J'AI PISCINE
En résumé
Le composant Form est responsable de la gestion des formulaires. À partir de vos objets métiers, vous pouvez construire vos formulaires qui seront utilis
dans vos vues.
Pour créer un formulaire, il vous faudra créer un type de formulaire qui sera automatiquement reconnu par le framework. Le composant fournit de très n
formulaires nativement, tous documentés et configurables selon vos besoins.
La validation des formulaires est automatique côté navigateur grâce aux attributs HTML5, la validation côté serveur se fait à l'aide du composant Validato
annotations sur les objets métiers directement.
Enfin, la customisation des formulaires se fait à l'aide de thèmes de formulaires. Le framework Symfony en fournit pour les principaux frameworks CSS, e
le gabarit de chaque type de formulaire, même pour un champ de formulaire spécifique.
Dans le prochain chapitre, nous introduirons une nouvelle brique importante pour nos applications : l'ORM Doctrine pour la persistance de données !
INDIQUER QUE CE CHAPITRE N'EST PAS TERMINÉ
 DYNAMISEZ VOS VUES À L’AIDE DE TWIG GÉREZ VOS DONNÉES AVEC DOCTR
Le professeur
Mickaël Andrieu
Consultant et Formateur Web / Data
OPENCLASSROOMS
OPPORTUNITÉS
AIDE
POUR LES ENTREPRISES
EN PLUS
Français

8 Interagissez Avec Vos Utilisateurs - Construisez Un Site Web À L'aide Du Framework Symfony 5 - OpenClassrooms

Transféré par

Informations du document

Titre original

Copyright

Formats disponibles

Partager ce document

Partager ou intégrer le document

Options de partage

Avez-vous trouvé ce document utile ?

Ce contenu est-il inapproprié ?

Droits d'auteur :

Formats disponibles

8 Interagissez Avec Vos Utilisateurs - Construisez Un Site Web À L'aide Du Framework Symfony 5 - OpenClassrooms

Transféré par

Droits d'auteur :

Formats disponibles

18/07/2022 07:15 Interagissez avec vos utilisateurs - Construisez un site web à l’aide du framework Symfony 5 - OpenClassrooms

Construisez un site web à l’aide du framework Symfony 5

Interagissez avec vos utilisateurs

Créez votre premier formulaire

public function getAuthor()

public function setAuthor($author)

class ArticleType extends AbstractType

public function configureOptions(OptionsResolver $resolver)

Les différents types de champs

Texte Choix Date et temps Divers Multiple Caché

TextType ChoiceType DateType CheckboxType CollectionType HiddenTy

Utilisation et rendu à l'aide de Twig

class FormController extends AbstractController

$form = $this->createForm(ArticleType::class, $article);

return $this->render('default/new.html.twig', array(

Et le template Twig correspondant :

Et en accédant à l’URL correspondante, voici un exemple de rendu :

Rendu d'un formulaire avec Twig

Validez vos formulaires simplement

Soumettez un formulaire et traitez les données reçues

<button type="submit" class="btn btn-primary">Créer</button>

Pour le rendu suivant:

Un formulaire que l'on peut enfin soumettre

$form = $this->createForm(ArticleType::class, $article);

if ($form->isSubmitted() && $form->isValid()) {

return $this->render('default/new.html.twig', array(

Les données de l'article ont bien été mises à jour

Une bonne chose de faite, n'est-ce pas ?

Nous nous préoccuperons de la sauvegarde en base de données dans un prochain chapitre.

Validez un formulaire avec le composant Validator

use Symfony\Component\Validator\Constraints as Assert;

$article = new Article();

la valeur à valider : ce peut être une chaîne de caractères, un tableau ou un objet ;

Dans un contrôleur, le validateur est accessible en utilisant l'interface ValidatorInterface.

Les contraintes de validation

Basique Texte Comparaison Date

NotBlank Email EqualTo Date

Collection Fichier Nombres / Finances Autres

Choice File Bic Callback

Collection Image CardScheme Expression

UniqueEntity Luhn UserPassword

Language Iban Valid

Retournez les erreurs à l'utilisateur

Une validation inattendue...

<button type="submit" class="btn btn-primary">Créer</button>

Et soumettons un formulaire invalide :

Oups ! Un article sans contenu n'est pas une bonne idée...

Customisez le rendu de vos formulaires

Mais que font exactement ces fonctions ?

Utilisez Twig pour construire vos formulaires

Les fonctions de Twig dédiées au composant Form

Attends, là, c'est quoi un thème de formulaire ?

Utilisez un thème de formulaire

{%- block checkbox_widget -%}

{%- block radio_widget -%}

{%- block datetime_widget -%}

<button type="submit" class="btn btn-primary">Créer</button>

Voici maintenant à quoi ressemble notre formulaire :

Formulaire après activation du thème Bootstrap 4

C'est déjà beaucoup mieux, non ?

Customisation d'un champ spécifique dans un gabarit

Il va falloir alors customiser uniquement ce "fragment" :

{% form_theme productForm _self %}