Symfony2:显示引导开关按钮并获取控制器中的选定值

问题描述 投票:0回答:2

我想在 symfony2 中实现以下字段。它有 2 个单选按钮,它们的样式类似于使用一些引导程序样式的 Switch。

示例在这里

在 html 和 bootstrap 上方,代码片段显示所需的输出

<div class="btn-group btn-toggle" data-toggle="buttons">
   <label class="btn btn-primary active">
      <input type="radio" name="options" value="option1"> On
   </label>
   <label class="btn btn-default">
      <input type="radio" name="options" value="option2" checked=""> Off
   </label>
</div>

输出

preview of this

要使此示例正常工作,需要标签内有标签。 但是 symfony 表单生成器正在渲染

<radio>..</radio>
<label></label>

如何使用 symfony 表单生成器在

<radio>
中渲染
<label>
标签?

在 symfony 中,我们使用此代码作为复选框,但它显示正常的单选按钮组,

->add('check', 'choice', array(
                'choices' => array(
                    0 => 'On',
                    1 => 'Off'
                ),
                    'expanded'  => true,
                    'multiple'  => false,
                'data' => 1
            ))
php css twitter-bootstrap symfony formbuilder
2个回答

0
投票

在 ProjectType.php 中

  $builder->add('progress', 'choice', array('label'=>'State of the project',
            'expanded' => true,
            'multiple' => false,
            'choices' => array(
                '1'=>'Draft',
                '2'=>'Advanced',
                '3'=>'Final step',
            )));

树枝:

            <div class="form-group">
                {{ form_label(form.progress) }}
                <div class="col-sm-9 btn-group" data-toggle="buttons">
                    {% for key,choice in form.progress.vars.choices %}
                    <label class="btn btn-default {% if choice.value == form.progress.vars.value %}active{% endif %}">
                        <input type="radio" id="{{ form.progress.vars.id }}_{{ key }}" {% if choice.value == form.progress.vars.value %}checked{% endif %}
                               autocomplete="off" name="{{ form.progress.vars.full_name }}" value="{{ choice.value }}">
                        {{ choice.label }}
                    </label>
                    {% endfor %}
                </div>
            </div>
© www.soinside.com 2019 - 2024. All rights reserved.