CSS class or id in a SELECT box OPTION? You can!

I’ve been wrestling my mind around a rather simple request today. I needed to display the first OPTION in a SELECT box in a different colour. Simple in HTML but I just couldn’t find a solution that would do it the cakeish way. Until I RTSC and found that I can specify the options in a more complex way.

Let’s not beat about the bush, here’s my code. I needed to display a hint as the first option and assign a css class to it:

  1. span class=”st0″>’genre_id’’empty’‘value’ => 0, ‘name’ => ‘– video genre –‘, ‘class’ => ‘label’),
  2.   ));

The same thing works when you define the main options. Instead of thinking

  1. span class=”st0″>"rock" => "Rock’n’roll",
  2.   "pop" => "For kids",
  3.   "samba" => "Samba",
  4. );

You have to think in terms of the extended array definition. As you can see, you can mix the two.

  1. span class=”st0″>"rock" => "Rock’n’roll"‘value’ => "pop", ‘name’ => ‘Not just for kids’, ‘id’ => ‘popId’, ‘class’ => ‘popular’, ‘attribute1’ => ‘value’, ‘another1’ => ‘value’‘value’ => "samba", ‘name’ => ‘Latin / Samba’),
  2. );

Leave a Reply