Silex - Symfony Froms - 如何将每个单选按钮及其标签包裹起来,以便为选择列表中的每个单选按钮分隔 div?

Silex - Symfony Froms - How to wrap each radio button and its label in to separate div for each radio in choice list?

我正在使用 Silex micro faramework 和 Symfony 表单。在树枝模板中,我使用以下方式生成此字段:

...
{{ form_widget(form.transport_selection) }}
... 

如何覆盖此 symfony twig 表单模板以在 Silex 中为每个集合(输入字段和标签)生成换行。

这是我的twig注册:

use Silex\Provider\FormServiceProvider;
use Symfony\Component\Translation\Loader\YamlFileLoader;
use Symfony\Component\Validator\Constraints as Assert;

$app->register(new Silex\Provider\TwigServiceProvider(), array(
    'twig.path' => [
        __DIR__.'/App/View',
    ]
)); 

如何为每个单选选项用 div 包装单选按钮和标签?

输出:

<div id="form_transport_selection">
  <input type="radio" id="form_transport_selection_0" name="form[transport_selection]" required="required" value="country" checked="checked">
  <label for="form_transport_selection_0" class="required">country</label>
  <input type="radio" id="form_transport_selection_1" name="form[transport_selection]" required="required" value="abroad">
  <label for="form_transport_selection_1" class="required">abroad</label>
</div>

预期输出:

<div id="form_transport_selection">
  <div class="radio1">
    <input type="radio" id="form_transport_selection_0" name="form[transport_selection]" required="required" value="country" checked="checked">
    <label for="form_transport_selection_0" class="required">country</label>
  </div>
  <div class="radio2">
    <input type="radio" id="form_transport_selection_1" name="form[transport_selection]" required="required" value="abroad">
    <label for="form_transport_selection_1" class="required">abroad</label>
  </div>
</div>

谢谢

您可以为此表单制作新模板并重新定义单选按钮视图

my.form.twig

{% extends "form_div_layout.html.twig" %}

{%- block choice_widget_expanded -%}
    <div {{ block('widget_container_attributes') }}>
    {% set i=1 %}
    {%- for child in form %}
        <div class="radio-{{i}}">
            {{- form_widget(child) -}}
            {{- form_label(child, null, {translation_domain: choice_translation_domain}) -}}
        </div>
        {% set i=i+1 %}
    {% endfor -%}
    </div>
{%- endblock choice_widget_expanded -%}

并在显示表单的控制器模板中使用它

{% form_theme form 'my.form.twig' %}
....
{{ form_widget(form.transport_selection) }}

扩展 MaxP 的回答。确保只为单选按钮修改它,你不想在复选框中使用它!我为复选框添加了不同的 class。请注意 if/else 来执行此操作。

{% extends "form_div_layout.html.twig" %}

{% block choice_widget_expanded %}
<div {{ block('widget_container_attributes') }}>
    {% set i=1 %}
    {% for child in form %}
        {% if form.vars.multiple == false %}
        <div class="radio-{{i}}">
        {% elseif form.vars.multiple == true %}
        <div class="checkbox-{{i}}">
        {% endif %}
            {{ form_widget(child) }}
            {{ form_label(child, null, {translation_domain: choice_translation_domain}) }}
        </div>
        {% set i=i+1 %}
        {% endfor %}
    </div>
{% endblock choice_widget_expanded %}

并在显示表单的控制器模板中使用它

{% form_theme form 'my.form.twig' %}
....
{{ form_widget(form.transport_selection) }}

使用 Symfony 时,我建议覆盖 app/Resources/views/Form/fields 中的所有 Twig 字段。html.twig

然后在 config.yml 上,您只需将其添加到 twig 的配置中即可使用

  twig:
      form_themes:
        - 'Form/fields.html.twig'