发生错误时，在“form_widget”上添加一个css类

Question

当错误（特定于字段）发生时，我想在form_widget（）上添加一个CSS类。

目前，我有这段代码：

{{ form_widget(form.firstName, {'attr': {'class': 'text-input'}}) }}

它生成此HTML代码：

<input type="text" id="userbundle_member_firstName" name="userbundle_member[firstName]" required="required" class="text-input" />

这很好，但我想在发生错误时（例如，该值太短），将添加一个css类。所以，我希望有类似的东西：

<input type="text" id="userbundle_member_firstName" name="userbundle_member[firstName]" required="required" class="text-input error-input" />

我尝试在doc上搜索解决方案（尤其是here），但我无法做我想做的事。

感谢您的帮助：D！

Answer 1

告诉Twig您的自定义表单的模板：

应用/配置/ config.yml

twig:
    debug:            %kernel.debug%
    strict_variables: %kernel.debug%
    form:
        resources:
            - 'YourBundle::form.html.twig'

并覆盖它们（检查 vendor / symfony / symfony / src / Symfony / Bridge / Twig / Resources / views / Form ）：

<强>的src / YourBundle /资源/视图/ form.html.twig

{% block form_widget_simple %}
{% if form.vars.errors|length > 0 %}
{% set class = attr.class is defined ? attr.class ~ ' error' : 'error' %}
{% set attr = attr|merge({'class': class}) %}
{% endif %}
{% spaceless %}
    {% set type = type|default('text') %}
    <input type="{{ type }}" {{ block('widget_attributes') }} {% if value is not empty %}value="{{ value }}" {% endif %}/>
{% endspaceless %}
{% endblock form_widget_simple %}

<强>更新

上述方法将更改所有表单片段的呈现，如果您只需要更改某个表单然后可以在本地执行，只需阅读文档（https://symfony.com/doc/current/book/forms.html#form-theming）