Symfony 4 - невозможно настроить attr для поля формы в formBuilder - PullRequest
Новая
       22

Symfony 4 - невозможно настроить attr для поля формы в formBuilder

1 голос
/ 05 января 2020

У меня есть функция, которая позволяет мне округлять углы моих кнопок с помощью этого кода: 

<input type="checkbox" class="custom-control-input" id="toggle-border-radius">
<label class="custom-control-label" for="toggle-border-radius">Border radius</label>

, который будет вызывать этот скрипт JS: 

// toggle border radius
    $("#toggle-border-radius").change(function (e) {
        e.preventDefault();
        $('.page-wrapper').toggleClass("boder-radius-on");
    });

Но это это написанный вручную код, и я хотел бы использовать реальную форму и сохранить ту же функциональность. Поэтому я создал свою форму с помощью formBuilder следующим образом: 

//... other fields
->add('activeBorderRadius', CheckboxType::class, [
                'required' => false,
                'label' => "Bords arrondis",
                'label_attr' => [
                    'class' => 'custom-control-label',
                    'for' => 'toggle-border-radius'
                ],
                'attr' => [
                    'class' => 'custom-control-input',
                    'id' => 'toggle-border-radius'
                ],
            ])

Но когда я загружаю страницу, скрипт JS не работает. И когда я проверяю исходный код, я нахожу это: 

<input type="checkbox" id="parametres_sidebarOptions_activeBorderRadius" name="parametres[sidebarOptions][activeBorderRadius]" class="custom-control-input form-check-input" value="1">

<label class="custom-control-label form-check-label" for="parametres_sidebarOptions_activeBorderRadius">Bords arrondis</label>

Почему я не могу выбрать атрибуты, которые я выбрал?

Спасибо за вашу помощь

Ответы [ 2 ]

0 голосов
/ 08 января 2020

Вы можете использовать «класс» вместо идентификатора. 

$(".custom-control-input").change(e => {
    e.preventDefault();
    $('.page-wrapper').toggleClass("boder-radius-on");
});

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

{% block you_widget %}
    {% set _class = '' %}
    {% if attr.class is defined %}
        {% set _class = ' class="' ~ attr.class ~ '"' %}
    {% endif %}
    {% set _label_class = '' %}
    {% if label_attr.class is defined %}
        {% set _label_class = ' class="' ~ label_attr.class ~ '"' %}
    {% endif %}
    <input type="checkbox" id="{{ id }}" name="{{ full_name }}"{{ _class }}>
    <label for="{{ id }}"{{ _label_class }}></label>
    <script>
        $('{{ id }}').change(e => {
            e.preventDefault();
            $('.page-wrapper').toggleClass('border-radius-on');
        });
    </script>
{% endblock you_widget %}

Как создать тип формы, см. здесь .

0 голосов
/ 05 января 2020

Вы также можете передавать параметры в поля формы при визуализации формы 

{{ form_row(form.activeBorderRadius, {'attr': {'class': 'custom-control-input', 'id': 'toggle-border-radius'}}) }}
{{ form_label(form.activeBorderRadius, {'attr': {'class': 'custom-control-label', 'for': 'toggle-border-radius'}}) }}
...