Symfony Bootstrap 4 Наследование макета формы

Я пытаюсь переопределить некоторые поля bootstrap_4_layout.html.twig, но обнаружил некоторые проблемы с блоком radio_widget. Мне нужно изменить элемент div на метку, но когда я отменяю блок, радиоэлемент дублируется при просмотре. Рассматриваемый div - это то, что с классом custom-control

{% block radio_widget %}
    {% set parent_label_class = parent_label_class|default(label_attr.class|default('')) %}
    {% if 'radio-custom' in parent_label_class %}
        {% set attr = attr|merge({class: (attr.class|default('') ~ ' custom-control-input')|trim}) %}
        <div class = "custom-control custom-radio{{ 'radio-inline' in parent_label_class ? ' custom-control-inline' }}">
            {{ form_label(form, null, { widget: parent() }) }}
        </div>
    {% else %}
        {% set attr = attr|merge({class: (attr.class|default('') ~ ' form-check-input')|trim}) %}
        <div class = "form-check{{ 'radio-inline' in parent_label_class ? ' form-check-inline' }}">
            {{ form_label(form, null, { widget: parent() }) }}
        </div>
    {% endif %}
{% endblock radio_widget %}

Анализируя дом с консолью, я вижу, что создаются два элемента с классом custom-control. Почему?

imho SelectType - монстр, когда дело доходит до генерации html-кода.

— 05.05.2018 12:10

forms symfony bootstrap-4

05.05.2018 11:18

JS - События опций формы

В продолжение предыдущей статьи CSS - стили, связанные с вводом формы , в этой статье мы будем использовать JS для взаимодействия с формами, на этот...

CSS - Стили, связанные с вводом формы

Общими стилями ввода для форм являются Input (включая Text, Radio, checkbox), Select и Textarea, из которых Input относительно прост, поэтому в этой...

Создание многостраничной формы заявления о приеме на работу с помощью Angular

Наличие на корпоративном сайте форм заявлений о приеме на работу, или "трудовых анкет", экономит время и деньги как для соискателей, так и для...

Проверка дублирующего ввода с помощью этой простой функции JavaScript

Это моя html форма, обернутая в таблицу:

950

Перейти к ответу Данный вопрос помечен как решенный

Ответы 1

Ответ принят как подходящий

Я нашел решение. Я переопределил блок radio_widget и изменил элемент div меткой:

{% block radio_widget %}
    {% set parent_label_class = parent_label_class|default(label_attr.class|default('')) %}
    {% if 'radio-custom' in parent_label_class %}
        {% set attr = attr|merge({class: (attr.class|default('') ~ ' custom-control-input')|trim}) %}
        <label class = "custom-control custom-radio{{ 'radio-inline' in parent_label_class ? ' custom-control-inline' }}">
            {{ form_label(form, null, { widget: parent() }) }}
        </label>
    {% else %}
        {% set attr = attr|merge({class: (attr.class|default('') ~ ' form-check-input')|trim}) %}
        <div class = "form-check{{ 'radio-inline' in parent_label_class ? ' form-check-inline' }}">
            {{ form_label(form, null, { widget: parent() }) }}
        </div>
    {% endif %}
{% endblock radio_widget %}

Затем я отменяю также блок checkbox_radio_label. Внутри я подставил базовый код:

// ...
{{ widget|raw }}
// ...

С участием:

{% set attr = attr|merge({class: (attr.class|default('') ~ ' custom-control-input')|trim}) %}
<input type = "radio" {{ block('widget_attributes') }}{% if value is defined %} value = "{{ value }}"{% endif %}{% if checked %} checked = "checked"{% endif %} />

Для справки о блоках bootstrap 4 twig см. Эту ссылку: https://github.com/symfony/symfony/blob/master/src/Symfony/Bridge/Twig/Resources/views/Form/bootstrap_4_layout.html.twig

05.05.2018 15:46