symfony - 如何在树枝模板中的“form_row”上添加 CSS 类

Question

我想知道如何在 twig 的“{{ form_row() }}”上添加一个 CSS 类。目前，我有这个代码：

{{ form_row(form.username, {'label' : "Login", 'attr': {'class': 'loginForm'}}) }}

...但是 HTML 代码中没有使用 CSS 类“loginForm”。

谢谢 ：） ！

Answer 1

If you want the common class for the form_row (it means one class for form_label, form_widget and form_errors), you should customize a field_row block.

This article explains how to customize form fields: How to customize Form Rendering. There are some methods to do this.

For example I'm using Method 2 (How to customize Form Rendering: Method 2):

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

{% block field_row %}
{% spaceless %}
    {% set class='' %}
    {% if attr.class is defined %}
    {% set class = 'class="' ~ attr.class ~ '"' %}
    {% endif %}

    <div {{ class }} >
        {{ form_label(form, label|default(null)) }}
        {{ form_errors(form) }}
        {{ form_widget(form) }}
    </div>
{% endspaceless %}
{% endblock field_row %}

Answer 2

我的答案与 nni6 非常相似，但它允许您通过整个 attr 数组。

我的 HTML 结构适用于 Twitter Bootstrap，但你可以拥有任何你想要的东西。如果有任何错误，此示例还会在包装器 div 上放置一个错误类 - 这部分不是必需的，但在使用 Bootstrap 时很有用：

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

{% block field_row %}
{% spaceless %}
    {% set field_row_classes = ['control-group'] %}
    {% if errors|length > 0 %}
        {% set field_row_classes = field_row_classes|merge(['error']) %}    
    {% endif %}

    <div class="{{ field_row_classes|join(' ') }}">
        {{ form_label(form, label|default(null)) }}
        <div class="controls">
            {{ form_widget(form, { 'attr' : attr|default({}) }) }}
            {{ form_errors(form) }}
            {% if help is defined %}
                <p class="help-block">{{ help }}</p>
            {% endif %}
        </div>
    </div>
{% endspaceless %}
{% endblock field_row %}

这里的区别是我form_widget用attr数组调用（如果指定了，默认为 {}）

现在您可以像往常一样设置表单，但要通过自定义类：

{{ form_row(myentity.myproperty, { 'label' : 'mylabel', 'attr' : { 'class' : 'myclass' }}) }}

Answer 3

这篇文章需要更新！

从 Symfony 4.3 开始，该row_attr选项允许添加属性（以及一些类）。让我们检查这些链接：

• 这里： https ://symfony.com/blog/new-in-symfony-4-3-more-form-improvements#row-attributes-in-form-themes

• 或更具体地说：https ://symfony.com/doc/current/reference/forms/types/form.html#row-attr

Answer 4

我使用此代码在 symfony 中配置引导程序

{% block field_row %}
{% spaceless %}
    <div class="control-group {% if errors|length > 0 %}error{% endif %}">
        {{ form_label(form, label, { 'attr': { 'class': 'control-label' } }) }}
        <div class="controls">
            {{ form_widget(form, { 'attr' : attr|default({}) }) }}
            {{ form_errors(form) }}
        </div>
    </div>
{% endspaceless %}
{% endblock field_row %}

Answer 5

在不覆盖块的情况下完成此操作的最简单方法是：

{% set attr = {'class' : form.myElement.vars.attr.class ~ ' addedClasses...', 'style' : form.myElement.vars.attr.style ~ '; addedStyles...'} %}
{{- form_row(form.myElement, {'attr' : attr}) -}}