如何防止 Twig 在它生成的字段中添加 form-control class?
How to prevent Twig from adding form-control class to the fields it generates?
我有这个代码:
{% for key, customField in customFields %}
{{ form_widget(formVirtualTerminal['cf_' ~ key], { 'attr': {'placeholder': customField['FieldDisplayName'], 'name': customField['FieldName'], 'class' : 'row no-gutters mb-3'} }) }}
{% endfor %}
它遍历一个数组并为它输出一些字段。但是,由于我不知道的原因,所有这些字段都生成了 form-control
class,这破坏了页面的设计。
在这个问题 () 中提到这是默认 Bootstrap 主题的一部分,他们讨论了如何在应用程序级别停用此主题。
但是,如果可能的话,我不希望进行如此彻底的更改。我想告诉 Twig 不要添加 classes.
以下是通过删除 class:
解决问题的 hack
$("#custom-text-field-container .form-control").removeClass("form-control");
但是,我想避免编写 Javascript 来从一开始就不应该有 class 的字段中删除 classes。
有没有办法告诉 twig 不要在这些文本字段中写入 form-control
class?
不修改主题是无法阻止的
你不能"tell twig not to add classes"。
form_widget
不接受任何参数来删除主题稍后应用的 class 或属性。
基本上,它无法控制模板的功能,它只会向模板传递您想要的任何参数,而如何使用该信息取决于表单模板。
例如对于 HTML classes,通常的方法是将您传递的任何 classes 与模板默认设置的任何 classes 合并。
解决方法同时保留您正在使用的大部分表单主题
一个简单的求助方式是 to create to your theme based on the form theme you are using (which seems to be 'bootstrap_4_layout.html.twig')
您只需要重写阻碍您的部分,其他一切保持原样。
例如"complete" 新主题可以短至:
{# templates/form/your_theme.html.twig #}
{% use 'bootstrap_4_layout.html.twig' %}
{% block form_widget_simple -%}
{% if type is not defined or type != 'hidden' %}
{%- set attr = attr|merge({class: (attr.class|default('') ~ (type|default('') == 'file' ? ' custom-file-input' : ''))|trim}) -%}
{% endif %}
{%- if type is defined and (type == 'range' or type == 'color') %}
{# Attribute "required" is not supported #}
{%- set required = false -%}
{% endif %}
{{- parent() -}}
{%- endblock form_widget_simple %}
这几乎是同一个form_widget_simple
块as the original,我只是把form-control
class和classes合并你可以通过通过.
您只能在您想要此自定义主题的模板中使用此表单,方法是在适当的模板中执行此操作:
{% form_theme form 'form/your_theme.html.twig' %}
或者如果您想在应用程序的所有表单中默认使用它:
# config/packages/twig.yaml
twig:
form_themes: ['form/your_theme.html.twig']
# ...
我有这个代码:
{% for key, customField in customFields %}
{{ form_widget(formVirtualTerminal['cf_' ~ key], { 'attr': {'placeholder': customField['FieldDisplayName'], 'name': customField['FieldName'], 'class' : 'row no-gutters mb-3'} }) }}
{% endfor %}
它遍历一个数组并为它输出一些字段。但是,由于我不知道的原因,所有这些字段都生成了 form-control
class,这破坏了页面的设计。
在这个问题 (
但是,如果可能的话,我不希望进行如此彻底的更改。我想告诉 Twig 不要添加 classes.
以下是通过删除 class:
解决问题的 hack$("#custom-text-field-container .form-control").removeClass("form-control");
但是,我想避免编写 Javascript 来从一开始就不应该有 class 的字段中删除 classes。
有没有办法告诉 twig 不要在这些文本字段中写入 form-control
class?
不修改主题是无法阻止的
你不能"tell twig not to add classes"。
form_widget
不接受任何参数来删除主题稍后应用的 class 或属性。
基本上,它无法控制模板的功能,它只会向模板传递您想要的任何参数,而如何使用该信息取决于表单模板。
例如对于 HTML classes,通常的方法是将您传递的任何 classes 与模板默认设置的任何 classes 合并。
解决方法同时保留您正在使用的大部分表单主题
一个简单的求助方式是 to create to your theme based on the form theme you are using (which seems to be 'bootstrap_4_layout.html.twig')
您只需要重写阻碍您的部分,其他一切保持原样。
例如"complete" 新主题可以短至:
{# templates/form/your_theme.html.twig #}
{% use 'bootstrap_4_layout.html.twig' %}
{% block form_widget_simple -%}
{% if type is not defined or type != 'hidden' %}
{%- set attr = attr|merge({class: (attr.class|default('') ~ (type|default('') == 'file' ? ' custom-file-input' : ''))|trim}) -%}
{% endif %}
{%- if type is defined and (type == 'range' or type == 'color') %}
{# Attribute "required" is not supported #}
{%- set required = false -%}
{% endif %}
{{- parent() -}}
{%- endblock form_widget_simple %}
这几乎是同一个form_widget_simple
块as the original,我只是把form-control
class和classes合并你可以通过通过.
您只能在您想要此自定义主题的模板中使用此表单,方法是在适当的模板中执行此操作:
{% form_theme form 'form/your_theme.html.twig' %}
或者如果您想在应用程序的所有表单中默认使用它:
# config/packages/twig.yaml
twig:
form_themes: ['form/your_theme.html.twig']
# ...