How to set a class attribute to a Symfony2 form input

PhpFormsSymfonyInputFormbuilder

Php Problem Overview


How can I set the HTML class attribute to a form <input> using the FormBuilder in Symfony2 ?

Something like this:

->add('birthdate', 'date',array(
      'input' => 'datetime',
      'widget' => 'single_text',
      'attr' => array(
          'class' => 'calendar'
      )
 ))

 {{ form_widget(form.birthdate) }}

I want this inputfield with the attribute class set to calendar

Php Solutions


Solution 1 - Php

You can do this from the twig template:

{{ form_widget(form.birthdate, { 'attr': {'class': 'calendar'} }) }}

From http://symfony.com/doc/current/book/forms.html#rendering-each-field-by-hand

Solution 2 - Php

You can do it with FormBuilder. Add this to the array in your FormBuilder:

'attr'=> array('class'=>'span2')

Solution 3 - Php

The answer by Acyra lead the right way if you want to set attributes inside the controller, but has many inaccuracies.

Yes, you can do it directly with the FormBuilder by using the attr attribute (introduced here for the 2.1 version and here for the 2.0) to the array of options as follows:

->add('birthdate', 'date',array(
      'input' => 'datetime',
      'widget' => 'single_text',
      'attr' => array('class'=>'calendar')
 ))

It is not true that the "functionality is broken". It works very well!

It is not true that Symfony2 applies the HTML class attribute to both the label and the input (at least from the 2.1 version).

Moreover, since the attr attribute is an array itself, you can pass any HTML attribute you want to render for the field. It is very helpful if you wanna pass the HTML5 data- attributes.

Solution 4 - Php

You can add it in the options of your form class:

public function configureOptions(OptionsResolver $resolver)
{
    $resolver->setDefaults(array(
        'data_class' => 'AppBundle\Entity\MyEntity',
        'attr' => array(
            'class' => 'form-horizontal'
        )
    ));
}

Solution 5 - Php

{{ form_widget(form.content, { 'attr': {'class': 'tinyMCE', 'data-theme': 'advanced'} })  }}

Solution 6 - Php

Like this:

{{ form_widget(form.description, { 'attr': {'class': 'form-control', 'rows': '5', 'style': 'resize:none;'} }) }}

Solution 7 - Php

You can to this in Twig or the FormClass as shown in the examples above. But you might want to decide in the controller which class your form should get. Just keep in mind to not have much logic in the controller in general!

    $form = $this->createForm(ContactForm::class, null, [
        'attr' => [
            'class' => 'my_contact_form'
        ]
    ]);

Solution 8 - Php

Renders the HTML widget of a given field. If you apply this to an entire form or collection of fields, each underlying form row will be rendered.

{# render a field row, but display a label with text "foo" #} {{ form_row(form.name, {'label': 'foo'}) }}

The second argument to form_row() is an array of variables. The templates provided in Symfony only allow to override the label as shown in the example above.

See "More about Form Variables" to learn about the variables argument.

Attributions

All content for this solution is sourced from the original question on Stackoverflow.

The content on this page is licensed under the Attribution-ShareAlike 4.0 International (CC BY-SA 4.0) license.

Content TypeOriginal AuthorOriginal Content on Stackoverflow
QuestionJean-Philippe BondView Question on Stackoverflow
Solution 1 - PhpDerek StobbeView Answer on Stackoverflow
Solution 2 - PhpAcyraView Answer on Stackoverflow
Solution 3 - PhpJeanValjeanView Answer on Stackoverflow
Solution 4 - PhpsegliView Answer on Stackoverflow
Solution 5 - PhpKiranView Answer on Stackoverflow
Solution 6 - PhpAlexandre VeloView Answer on Stackoverflow
Solution 7 - PhpKimView Answer on Stackoverflow
Solution 8 - PhpJavier MorilloView Answer on Stackoverflow