Toutes les clefs pour réussir dans le e-commerce

Mes modules Prestashop

Personnaliser les erreurs des formulaire dans twig

Si vous manipulez les formulaires avec symfony2 vous avez sans doute testé les validations et les messages d’erreurs.

Cela fonctionne très bien et je vous conseille la lecture de la doc officielle à ce sujet.

Pour afficher les erreurs la doc vous dit d’utiliser le code suivant:


{{ form_errors(form.age) }}

Le problème c’est que lorsqu’on affiche notre template on se retrouve avec ce code HTML:


<ul>
<li>
Texte de l'erreur
</li>
</ul>

Ca fonctionne mais ce n’est pas évident à manipuler vu qu’il n’y a pas de classe CSS appliquée ni au LI ni au UL

Voici donc comment faire pour ajouter une classe (et même plus) à vos messages d’erreurs.

Tout d’abord créez le fichier “src/Acme/DemoBundle/Resources/views/Form/error.html.twig” et ajoutez-y le code suivant:


{% block field_errors %}
{% spaceless %}
{% if errors|length > 0 %}
<ul class="error_list">
{% for error in errors %}
<li>{{ error.messageTemplate|trans(error.messageParameters, 'validators') }}</li>
{% endfor %}
</ul>
{% endif %}
{% endspaceless %}
{% endblock field_errors %}

Puis dans le template qui affiche votre formulaire ajoutez ceci:


{% form_theme form 'AcmeDemoBundle:Form:error.html.twig' %}

Voila désormais lorsque vous appellerez {{ form_errors(form.age) }} c’est ce template qui sera utilisé.
Vous avez désormais accès aux erreurs via la classe “error_list”. Mais si vous le désirez vous pouvez modifier complètement ce template pour afficher vos erreurs dans des “span” par exemple.

Poster un Commentaire

5 Commentaires sur "Personnaliser les erreurs des formulaire dans twig"

Recevoir un email pour
avatar
Trier par:   plus récent | plus vieux | Plus de vote
Julien
Invité

Merci pour ces conseils ! Après la personnalisation de ma 404, je vais essayer de personnaliser les erreurs dans mon formulaire de contact.

axool
Invité

Super utile, je cherchais depuis un moment, merci :) !

Damien Mbamba
Invité

Bonsoir,
Merci pour ce joli et court tutoriel,
je ne dirai pas mieux que les autres,
la doc de sy2 en parle mais jusque là ce n’était pas très bien expliqué bref trop superficiel,
maintenant je n’ai plus qu’a tester ça!
Cordialement.

Damien Mbamba
Invité

Ok Bah salut,
je reviens sur ton tuto
il y’a des erreurs que j’ai corrigé!
en faite c’est un sujet qui m’a beaucoup interpelé ça fait que je me suis rapidement documenté !
twig etant on ne peu plus flexible personnaliser les erreurs de formulaire revient a personnaliser le fragment form_errors des formulaires dans twig, Cette méthode tire avantage
de l’héritage de type de champs. Plus précisément, puisque le type text étend le type field,
le composant formulaire cherchera d’abord le fragment spécifique au type (par exemple : text_errors ==> dans notre cas précis) avant de se rabattre sur le nom du fragment parent si le spécifique n’existe pas (par exemple : form_errors)

Donc avec ta methode il suffit juste de remplacer field par text:
{% block text_errors %}
{% spaceless %}
{% if errors|length > 0 %}

{% for error in errors %}
{{ error.messageTemplate|trans(error.messageParameters, ‘validators’) }}
{% endfor %}

{% endif %}
{% endspaceless %}
{% endblock text_errors %}

et le reste sans changement tout fonctionne correctement !

wpDiscuz