如何覆蓋Symfony的Twig Form模板中的復選框

Question

我目前正在嘗試覆蓋Symfony 2中的復選框塊的默認呈現，但我無法實現所需的結果。

我創建了一個名為“Categories”的Doctrine Entity，並且所有視圖都已正確創建。

但是Twig形式的默認復選框標簽位置不正確。

PS。：我從這里刪除了元素的屬性，使其更加干凈。

原樣：

<label>Field</label>
<input type="checkbox" />

應該：

<label><input type="checkbox" />Field</label>

我已經創建了一個用於覆蓋塊本身的模板：

{% block checkbox_widget %}
{% spaceless %}
<label for="{{ id }}">
<input type="checkbox" {{ block('widget_attributes') }}{% if value is defined %} value="{{ value }}"{% endif %}{% if checked %} checked="checked"{% endif %} />
{{ label|trans({}, translation_domain) }}</label>
{% endspaceless %}
{% endblock checkbox_widget %}

並在我的edit.html.twig文件中調用它：

{% extends '::base.html.twig' %}
{% form_theme edit_form 'AppGallerySiteBundle:Form:fields.html.twig' %}

在表格中我放置了線條：

{{ form_errors(edit_form) }}
{{ form_row(edit_form) }}
{{ form_widget(edit_form) }}
{{ form_rest(edit_form) }}

這是有效的，復選框被覆蓋，但是默認樹枝形式模板中的普通標簽繼續顯示，而我的覆蓋復選框沒有顯示其中的標簽，導致：

<label>Field</label>
<label><input type="checkbox" /></label>

它應該在哪里：

<label><input type="checkbox" />Field</label>

希望有人可以提供幫助。 提前致謝。

Answer 1

您應該禁用復選框的渲染標簽。 所以你需要像這樣覆蓋block form_label ：

{% block form_label %}
{% if 'checkbox' not in block_prefixes %}
  {{ parent() }}
{% endif %}
{% endblock form_label %}

Answer 2

為了更正輸入和標簽的順序，您可以覆蓋form_row塊：

{% block form_row %}
  {% spaceless %}
    {% if 'checkbox' in block_prefixes %}
      {{ form_widget(form) }}
      {{ form_label(form) }}
    {% else %}
      {{ form_label(form) }}
      {{ form_widget(form) }}
    {% endif %}
    {{ form_errors(form) }}
  {% endspaceless %}
{% endblock form_row %}

Answer 3

同樣的問題困擾着我們的項目。

PHP Array類型的單個Entity字段（因此ORM將其作為JSON字符串存儲在數據庫記錄單元格中，透明地自動解碼並對其進行編碼）應該分解用戶的布爾首選項列表，每個列表都呈現為一個復選框。

所以在EntityType.php里面

 public function buildForm(FormBuilderInterface $builder, array $options) 

$builder
 ->add('prefs','collection', 

然后，在主枝模板中，而不是{{ form(form) }}它按行迭代：

{% for j,child in form %}
   <div id="form-child-{{ j }}" title="form-child-{{ j }}; loop={{loop.index}}">
        {{ form_row(child) }} 
   </div>
{% endfor %}     

雖然這可能沒有必要。

在該文件中更高，我用一個主題覆蓋表單的呈現：

 {% form_theme form 'SystemExtMainBundle:Blocks:checkbox.html.twig' %} 

其中包含：

{% block form_row %}
        {% if form.vars.block_prefixes.1 == 'checkbox'   %}
<div class="col-xs-12 checkbox-margins checkbox-label-padding">
    <div class="errors-container">
    {{ form_errors(form)}}
    </div>  
     {{ form_widget(form,{'attr': {'class': '  form-checkbox-widget'}}) }}{{ form_label(form) }}


</div>


        {% elseif form.vars.block_prefixes.1 == 'choice' %}
<div class="col-xs-12 top-form-title">
                        {{ form_label(form) }}
</div>
<div class="col-xs-12 select-margins">
    <div class="errors-container">
    {{ form_errors(form)}}
    </div>  
                    {{ form_widget(form,{'attr': {'class': 'select-style form-control'}}) }}

</div>
        {% elseif form.vars.block_prefixes.1 == 'submit'%}
         {{ form_widget(form,{'attr': {'class': 'top-form-button form-control pull-rigth'}}) }}
        {% elseif form.vars.block_prefixes.1 == 'text'%}

<div class="col-xs-12 top-form-title">
                        {{ form_label(form) }}
</div>
<div class="col-xs-12 ">
    <div class="errors-container">
    {{ form_errors(form)}}
    </div>  

{％set attr = attr | merge（{'class':( attr.class | default（''）~'form-control top-form-input'）| trim}）％} {{form_widget（form，{' attr'：attr}）}}

</div>
{% else %}

<div class="col-xs-12 top-form-title "> 
                        {{ form_label(form) }}
</div>
<div class="col-xs-12 ">
    <div class="errors-container">
    {{ form_errors(form)}}
    </div>  
                        {{ form_widget(form) }}
</div>
        {% endif %}


{% endblock form_row %}

關鍵部分是上面第7行： {{ form_widget(form,{'attr': {'class': ' form-checkbox-widget'}}) }}{{ form_label(form) }}用於復選框，將小部件和標簽順序放入我想要的內容（首先將交互式復選框放在其文本標簽之前）。