unlytill
unlytill

Reputation: 33

How to add style on errors on RepeatedType in form?

I try to add a style to the errors messages generated from my RepeatedType in my form by it does no effects.

Here is my code in my controller:

    public function signupAction(Request $request)
    {
        $user = new Users();

        $form = $this->createFormBuilder($user)
            ->add('email', EmailType::class, array(
                'required' => true,
                'label' => 'e-Mail'
            ))
            ->add('password', RepeatedType::class, array(
                'type' => PasswordType::class,
                'invalid_message' => 'passwords are not identicals',
                'options' => array('attr' => array('class' => 'password-field')),
                'required' => true,
                'first_options'  => array('label' => 'Password'),
                'second_options' => array('label' => 'Confirm password'),
            ))
            ->add('submit', SubmitType::class, array(
                'label' => 'Submit'
            ))
            ->getForm();

And here my code in my twig View:

{% block stylesheets %}
    <style>
        .error_msg {
            color: red;
        }
    </style>
{% endblock %}

{% block body %}
    {{ form_start(form) }}
        {{ form_label(form.email) }}
        {{ form_widget(form.email) }}
        <div class="error_msg">{{ form_errors(form.email) }}</div>

        {{ form_label(form.password) }}
        {{ form_widget(form.password) }}
        <div class="error_msg">{{ form_errors(form.password) }}</div>
{% endblock %}

So, it works well for form.email but not for form.password. If I try to apply the style on {{ form_errors(form.password.children['first']) }}, the error is displayed 2 times (1 with no style, and 1 with the styles.)

How can I do it ?

Upvotes: 2

Views: 836

Answers (1)

Roubi
Roubi

Reputation: 2106

Doing as follows, error only displays once (code tested):

    {{ form_start(form) }}
    {{ form_widget(form.plainPassword.children['first']) }}
    <div style="background-color: red;">{{ form_errors(form.plainPassword.children['first']) }}</div>
    {{ form_widget(form.plainPassword.children['second']) }}
    <div style="background-color: red;">{{ form_errors(form.plainPassword.children['second']) }}</div>
    {{ form_end(form) }}

Upvotes: 5

Related Questions