我有一个问题。所以我有这样的形式:
public function buildForm(FormBuilderInterface $builder, array $options)
{
$aColors = array();
foreach(Colors::$aNewsColors as $k=>$v){
$aColors['<div style="background-color:'.$v['textCategoryColor'].'">'.$v['name'].'</div>'] = $k;
}
$builder
->add('title', TextType::class)
->add('image',FileType::class, array('data_class' => null))
->add('document',FileType::class, array('data_class' => null))
->add('content',TextareaType::class)
->add('color_id',ChoiceType::class, array('choices' => $aColors,'choices_as_values' => true))
->add('is_top_news',CheckboxType::class)
->add('has_gallery',CheckboxType::class)
->add('save',SubmitType::class, array('label'=> 'Save'))
;
}
问题在于此 color_id ,因为在表单中获取如下所示的选择框:
<option value="1"><div style="background-color:rgb(174,252,202)">Green</div></option>
<option value="2"><div style="background-color:rgb(12,2,43)">Red</div></option>
因此不解释背景颜色。你能帮我吗 ?
答案 0 :(得分:1)
首先要做的事情。 浏览器不会解释背景颜色,因为它在 <div>
内的 <option>
上设置。
话虽如此,我同意其他人的意见,你应该使用javascript库。使用<select>
标签赢得的东西看起来不错。
但你的问题需要一个实际的答案,事实证明,即使你使用的是javascript库,我建议的方法也会对你有所帮助。
要真正回答您的问题,请使用&#39; choice_attr&#39;
$aColors = array();
$choiceAttr = array();
foreach(Colors::$aNewsColors as $k=>$v){
$aColors[$v['name']]=$k;
$choiceAttr[$v['name']]=array(
'style'=>'background-color: ' . $v['textCategoryColor']. ';',
);
}
$builder
->add('title', TextType::class)
->add('image',FileType::class, array('data_class' => null))
->add('document',FileType::class, array('data_class' => null))
->add('content',TextareaType::class)
->add('color_id',ChoiceType::class, array(
'choices' => $aColors,
'choices_as_values' => true,
'choice_attr'=>$choiceAttr,
))
->add('is_top_news',CheckboxType::class)
->add('has_gallery',CheckboxType::class)
->add('save',SubmitType::class, array('label'=> 'Save'))
;
这应输出
<option value="1" style="background-color:rgb(174,252,202);">Green</option>
<option value="2" style="background-color:rgb(12,2,43);">Red</option>
如果您决定使用javascript库,则不限于设置&#34;样式&#34;在&#39; choice_attr&#39;。 除了#34;风格&#34;属性,你可以使用&#39; choice_attr&#39;设置&#34;类&#34;属性或您可以提出的任何属性(例如&#34;数据颜色值&#34;)。
答案 1 :(得分:0)
您需要使用js。
我认为你可以循环div并给出一个带有必要信息的数据颜色属性(id,color ...)并检索js side
当您单击选择时,您恢复了该值(即id),然后您将查找数据属性的所有div元素并找到该ID。
在视图example.html.twig
中{% for color in textCategoryColors %}
<div data-color="{color | json_encode}"></div>
{% endfor %}