Symfony2 Form Type - how to set form CSS class as attribute?

Question

When I set CSS class in form controller and pass it as $options array element it works.

private function createEditForm(OrderCard $entity)
{
    $form = $this->createForm(new OrderCardType($this->get('security.context')
                                       ->isGranted('ROLE_SUPER_ADMIN')), $entity, array(
        'action' => $this->generateUrl('ordercard_update', array('id' => $entity->getId())),
        'attr'=>array(
                 'class'=>'form-horizontal'
                )
    ));

    return $form;
}

But when I want to have same effect using formType it is not added to form:

public function buildForm(FormBuilderInterface $builder, array $options)
{
      $builder
          // not works
          ->setAttribute('attr', array('class' => 'form-horizontal'))
          // not works either
          ->setAttribute('class', 'form-horizontal')
//...

What I do wrong? How to make it work?

xiidea · Accepted Answer · 2014-04-06 16:29:48Z

9

This can be done from several places:

define in setDefaultOptions method of Form Type class
As a parameter of $this->createForm function called from controller.
define in buildView method of Form Type class
In template while rendering form

You just to know which option has precedence over another, and how they work.

Option 1: Here is the place to set default options. If no where else set the value this default value will be used.

Example Implementation (As Pivot provided):

/**
 * @param OptionsResolverInterface $resolver
 */
public function setDefaultOptions(OptionsResolverInterface $resolver)
{
    $resolver->setDefaults(array(
        'attr' => array(
            'class' => 'form-horizontal-from-default'
        ),
    ));
}

Option 2: You already know this, you can provide the attr value while calling $this->createForm from controller(which is actually a shortcut for $this->container->get('form.factory')->create function). When you provide this value, the value set from previous option will overridden.

Example Implementation (As You provided):

$this->createForm($formTypeObject, $entity, array(
    'action' => 'URL,
    'attr'=>array('class'=>'form-horizontal')
));

Option 3: You can set or override the value set by previous two option here. setting the value in buildView method. Declare following method in your Form Type Class:

/**
 * {@inheritdoc}
 */
public function buildView(FormView $view, FormInterface $form, array $options)
{              
    $options['attr']['class'] = 'form-horizontal-from-build-view';
    //If you like to keep value set from previous methods you can define like
    //$options['attr']['class'] = isset($options['attr']['class'])? $options['attr']['class'] :'';
    //$options['attr']['class'] .= ' form-horizontal-from-build-view';

    $view->vars = array_replace($view->vars, array(
        'attr'  => $options['attr'],
    ));
}

Option 4:: Now the final and ultimate way to set attributes. This has the height priority over other options, as it is done in the final stage while rendering the form.

You can define as follow in your template:

{{ form_start(form, {'method': 'POST', 'attr': {'class': 'form-horizontal-ultimate' }}) }}

answered Apr 6, 2014 at 16:29

xiidea

3,40222 silver badges24 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

Paweł Madej Over a year ago

after writing this question I've googled option 4 but 1,3 I didn't knew about yet. Which one should be preffered choice? setting css (option 4) in view in my opinion is best way, but maybe other options are preffered?

xiidea Over a year ago

Each of this options have their own use case. You can chose whichever fit most to your use case. just remember the priority of each options. One method can override others.

mattcrowe · Accepted Answer · 2014-04-06 13:39:40Z

1

Add the following to class OrderCardType:

/**
 * @param OptionsResolverInterface $resolver
 */
public function setDefaultOptions(OptionsResolverInterface $resolver)
{
    $resolver->setDefaults(array(
        'attr' => array(
            'class' => 'form-horizontal'
        ),
    ));
}

answered Apr 6, 2014 at 13:39

mattcrowe

4241 gold badge5 silver badges15 bronze badges

1 Comment

Paweł Madej Over a year ago

thanks for answer, but @xiidea was better at details so I accepted his.

jose.serapicos · Accepted Answer · 2017-09-15 09:55:12Z

0

After Symfony 3, you can use:

/**
 * @param OptionsResolver $resolver
 */
public function configureOptions(OptionsResolver $resolver)
{
    $resolver->setDefaults(array(
        'data_class' => $this->conf['entityClass'],
        'attr' => array('class' => 'form-horizontal')
    ));
}

answered Sep 15, 2017 at 9:55

jose.serapicos

7487 silver badges10 bronze badges

Collectives™ on Stack Overflow

Symfony2 Form Type - how to set form CSS class as attribute?

3 Answers 3

2 Comments

1 Comment

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

2 Comments

1 Comment

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related