Question

I’m using a sfWidgetFormSelect widget to render a select list. More precisely i’m using the feature allowing groups, quite easy with this :

$choices = array(
  'Europe'  => array('France' => 'France', 'Spain' => 'Spain', 'Italy' => 'Italy'),
  'America' => array('USA' => 'USA', 'Canada' => 'Canada', 'Brazil' => 'Brazil'),
);    
$w = new sfWidgetFormChoice(array('choices' => $choices));

That’s a good start but not enough because i need to have specific CSS classes attached to each item of the list.

How can i do that ? The doc is not really helping for this kind of advanced features.

Thanks.

Answer 1

Having played with these a little bit, from what I know, this level of control isn’t possible via the form class. You can pass the CSS class to the main widget but it would apply to all <option> tags inside the <select>.

You might be better of just writing this dropdown yourself in HTML and making sure it corresponds to this widget in terms of how it’s named. This way you can use your own HTML but still use the widget in validation. Another option might be to handle the advanced styling via Javascript where you can connect it to the option values themselves, although it does get a little messy.