Symfony2 – Как поставить метку и ввести флажки / радиостанции в одной строке?

У меня была та же проблема, и я не смог найти решение, поэтому сам отработал. Вы правы, что вам нужно переопределить {% block choice_widget %} . Первым шагом является удаление {{ form_label(child) }} из раздела {% if expanded %} {{ form_label(child) }} {% if expanded %} который выводит отдельную метку.

 {% block choice_widget %} {% spaceless %} {% if expanded %} <div {{ block('widget_container_attributes') }}> {% for child in form %} {{ form_widget(child) }} {# {{ form_label(child) }} <--------------------- remove this line #} {% endfor %} </div> {% else %} <select {{ block('widget_attributes') }}{% if multiple %} multiple="multiple"{% endif %}> {% if empty_value is not none %} <option value="">{{ empty_value|trans }}</option> {% endif %} {% if preferred_choices|length > 0 %} {% set options = preferred_choices %} {{ block('widget_choice_options') }} {% if choices|length > 0 and separator is not none %} <option disabled="disabled">{{ separator }}</option> {% endif %} {% endif %} {% set options = choices %} {{ block('widget_choice_options') }} </select> {% endif %} {% endspaceless %} {% endblock choice_widget %} 

Теперь вам просто нужно обработать печать метки в {% block checkbox_widget %} .

 {% 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 }}</label> {% endspaceless %} {% endblock checkbox_widget %} 

Вам нужно будет сделать то же самое для {% block radio_widget %} поскольку в противном случае у него не будет метки.

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

С помощью Альберто Гаона и Джеймса, Symfony 2.4 правильное решение для интеграции BS3 радио И флажки следующие:

По вашему мнению, у вас есть:

 {% form_theme form 'AcmeDemoBundle:Form:fields.html.twig' %} // A radio or checkbox input {{ form_widget(form.example) }} 

Затем в вашем файле fields.html.twig (который переопределяет https://github.com/symfony/symfony/blob/master/src/Symfony/Bridge/Twig/Resources/views/Form/form_div_layout.html.twig , см. Http: //symfony.com/doc/current/cookbook/form/form_customization.html )

 {# src/Acme/DemoBundle/Resources/views/Form/fields.html.twig #} {% block choice_widget_expanded %} {% spaceless %} <div {{ block('widget_container_attributes') }}> {% for child in form %} {% if multiple %} <div class="checkbox"> {% else %} <div class="radio"> {% endif %} {{ form_widget(child) }} </div> {% endfor %} </div> {% endspaceless %} {% endblock choice_widget_expanded %} {% block checkbox_widget %} {% spaceless %} {% if label is empty %} {% set label = name|humanize %} {% endif %} <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 %} {% block radio_widget %} {% spaceless %} {% if label is empty %} {% set label = name|humanize %} {% endif %} <label for="{{ id }}"> <input type="radio" {{ block('widget_attributes') }}{% if value is defined %} value="{{ value }}"{% endif %}{% if checked %} checked="checked"{% endif %} />{{ label|trans({}, translation_domain) }} </label> {% endspaceless %} {% endblock radio_widget %} 

ПРИМЕЧАНИЕ. Обновлено решение Bob F для Symfony 2.3 (см. https://github.com/symfony/symfony/blob/2.3/src/Symfony/Bridge/Twig/Resources/views/Form/form_div_layout.html.twig ):

Переопределить choice_widget_expanded:

 {% block choice_widget_expanded %} {% spaceless %} <div {{ block('widget_container_attributes') }}> {% for child in form %} {{ form_widget(child) }} {% endfor %} </div> {% endspaceless %} {% endblock choice_widget_expanded %} 

Переопределить флажок (стиль начальной загрузки):

 {% block checkbox_widget %} {% spaceless %} <label for="{{ id }}" class="checkbox {% if checked %}checked{% endif %}" ><span class="icons"><span class="first-icon fui-checkbox-unchecked"></span><span class="second-icon fui-checkbox-checked"></span></span><input type="checkbox" {{ block('widget_attributes') }}{% if value is defined %} value="{{ value }}"{% endif %}{% if checked %} checked="checked"{% endif %} />{{ label|trans }}</label> {% endspaceless %} {% endblock checkbox_widget %} 

Переопределить радиобуй

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

Когда метка отображается, она будет включать атрибут for – это связывает label со input – см. Документы на label здесь, изменяя вывод на то, что вы предложили, является еще одним способом связывания label и input

Если вы хотите, чтобы метка отображалась слева от ввода, вам нужно изменить свой шаблон на:

 {% for child in form %} <div> {{ form_label(child) }} {{ form_widget(child) }} </div> {% endfor %} 

Что делает label перед input а затем создает следующий вывод

 <div> <div> <label ...></label> <input ...> </div> <div> <label ...></label> <input ...> </div> </div> 

Затем вы можете применить стиль CSS, чтобы он отображался в строке:

 ​div label { display: inline-block; width: 200px; }​ 

По умолчанию – без какого-либо CSS label выстраивается в линию перед input с этим макетом HTML, но inline-block позволяет также использовать атрибут width чтобы обеспечить правильное выравнивание всех полей – независимо от длины текста ярлыка

Рабочий пример здесь

Ввод формы в тег метки приведет к поломке HTML.

Какова ваша цель? Если вы просто хотите сделать ярлык и входное шоу в одной строке в браузере, вы можете использовать css:

 input, label { display: inline; } 

В Symfony 2.4 это работает не так, как ожидалось.

 {% 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 }}</label> {% endspaceless %} {% endblock checkbox_widget %} 

… ярлык недоступен. Вам необходимо добавить следующее:

 {% if label is empty %} {% set label = name|humanize %} {% endif %} 

Таким образом, полное решение:

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

Ярлык довольно тривиален, поэтому я лично предпочитаю его вручную.

Быстро и грязно в твоей веточке:

 <label for="field"> {{ form_widget(form.field) }} Field Label </label> 

Мне бы понравилось, если бы у Symfony было более простое решение для этого, но что бы это ни было.

Конечно, вышеупомянутые ответы, возможно, более элегантны, а что нет. 😉

Вы можете переопределить функцию form_row (модифицированную так, чтобы она соответствовала метке храма / флажком twitter bootstrap): (в этом примере это «флажок», но я думаю, что «радио» работает одинаково)

 {% extends 'form_div_layout.html.twig' %} {% block field_row %} {% spaceless %} {% if 'checkbox' in types %} {% if not compound %} {% set label_attr = label_attr|merge({'for': id}) %} {% endif %} {% if required %} {% set label_attr = label_attr|merge({'class': (label_attr.class|default('') ~ ' required')|trim}) %} {% endif %} {% if label is empty %} {% set label = name|humanize %} {% endif %} <label class="checkbox" {% for attrname, attrvalue in label_attr %} {{ attrname }}="{{ attrvalue }}"{% endfor %}>{{ label|trans({}, translation_domain) }} {{ block('checkbox_widget') }} </label> {% else %} {{ parent() }} {% endif %} {% endspaceless %} {% endblock field_row %}