Question

I’m trying to do a simple form to add an activity with a name and a color.

So I want to make a list with some an array of color, for now it is working I have the name of the color, but what I want is to make something like :

<select id="a" name="select" style="width: 10%;">
    <option style="background-color: FF0;" value="FF0"></option>
    <option style="background-color: F0F;" value="F0F"></option>
    <option style="background-color: 0FF;" value="0FF"></option>
</select> 

How can I add “style=”background-color:”mycolor;” to my form ?

public function buildForm(FormBuilder $builder, array $options)
{        
    $builder->add('name');         
    $listColor;

    for($r = 0;$r < 255; $r = $r + 120)
    {
        for($g = 0;$g < 255; $g = $g + 120)
        {    
            for($b = 0;$b < 255; $b = $b + 120)        
            {
                $string = dechex($r).dechex($g).dechex($b);
                $listColor[$string] = $string;
            }
        }
    }
    $builder->add('color', 'choice', array(
        'choices' => $listColor));
}

Is there a trick to had some option int the array ? to put some html ?

The closest thing I found about it was to add a class name on your form to do something in css after it…

{{ form_widget(form, { 'attr': {'class': 'myclass'}}) }}

Thanx 😉

RaFF

Answer 1

You can use jquery to Resolve this problem, try this example :

JSBIN “style=”background-color:”mycolor;”

$(document).ready(function(){
    $("#a option").each(function(index,value){
       var option = $(this);
       var bc= 'background-color:'+option.val()+';';
       option.attr('style',bc);
    });
});