Symfony表单标签渲染

Question

我希望将所有的标签转换为的placeholder属性：

例如：

原始代码：

<div>
  <label>FooBar</label>
  <input type="text"/>
</div>
<div>
  <label>FooBar2</label>
  <input type="checkbox"/>
</div>

This is what I want:

<div>
  <input type="text" placeholder="FooBar"/>
</div>
<div>
  <label>FooBar2</label>
  <input type="checkbox"/>
</div>

我尝试通过覆盖twig表单模板的部分内容来实现这一点，但是没有成功。以下是一次尝试：

{% block form_widget_simple %}
    {% set type = type|default('text') %}

        {% if type == 'text' %}
                    {% block form_label %}{% endblock %}
        {% endif %}

    <input placeholder="{{ label|trans({}, translation_domain) }}" data-test="formtest" type="{{ type }}" {{ block('widget_attributes') }} {% if value is not empty %}value="{{ value }}" {% endif %}/>
{% endblock form_widget_simple %}

谢谢！

- jspizziri

Answer 1

离开这个网站一段时间并学习了更多的Twig后，我终于回来并以正确的方式完成了它。

在我看来，这是应该这样做的：

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


{# override label creation, remove all labels from inputs and text areas #}

{% block form_row %}
{% spaceless %}
    <div>
    {% if form.vars.block_prefixes[1] != 'text' %}
        {{ form_label(form) }}
    {% endif %}
    {{ form_errors(form) }}
    {{ form_widget(form) }}
    </div>
{% endspaceless %}
{% endblock form_row %}


{# widgets #}
{% block form_widget_simple %}
    {% set type = type|default('text') %}
    <input placeholder="{{ label|trans({}, translation_domain) }}" type="{{ type }}" {{ block('widget_attributes') }} {% if value is not empty %}value="{{ value }}" {% endif %}/>
{% endblock form_widget_simple %}

{% block textarea_widget %}
{% spaceless %}
    <textarea placeholder="{{ label|trans({}, translation_domain) }}" {{ block('widget_attributes') }}>{{ value }}</textarea>
{% endspaceless %}
{% endblock textarea_widget %}

运行得非常好！

- jspizziri

Answer 2

如果您正在使用新的Bootstrap主题：

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

{% block form_row -%}
    <div class="form-group{% if (not compound or force_error|default(false)) and not valid %} has-error{% endif %}">
        {% if form.vars.block_prefixes[1] != 'text' %}
            {{ form_label(form) }}
        {% endif %}
        {{ form_widget(form) }}
        {{ form_errors(form) }}
    </div>
{%- endblock form_row %}

{% block form_widget_simple -%}
    {% if attr.placeholder is not defined or attr.placeholder == '' %}
        {% set attr = attr|merge({placeholder: label|trans({}, translation_domain)|trim(':')|trim}) %}
    {% endif %}

    {% if type is not defined or 'file' != type %}
        {% set attr = attr|merge({class: (attr.class|default('') ~ ' form-control')|trim}) %}
    {% endif %}
    {{- parent() -}}
{%- endblock form_widget_simple %}

{% block textarea_widget -%}

    {% if attr.placeholder is not defined or attr.placeholder == '' %}
        {% set attr = attr|merge({placeholder: label|trans({}, translation_domain)|trim(':')|trim}) %}
    {% endif %}

    {% set attr = attr|merge({class: (attr.class|default('') ~ ' form-control')|trim}) %}
    {{- parent() -}}
{%- endblock textarea_widget %}

注意：我添加了|trim(':')以删除FOSUserBundle生成的标签末尾的冒号。

此外，为了我的项目需要大输入框，所以我在这里添加了input-lg（包括简单输入框和文本输入框）：

{% set attr = attr|merge({class: (attr.class|default('') ~ ' input-lg form-control')|trim}) %}

- Henry

Answer 3

更简洁的方式并保留原始代码块（仍然可以进行更新）。

{% use 'form_div_layout.html.twig' with widget_attributes as base_widget_attributes %}
{% block widget_attributes %}
    {% set attr = {'placeholder': label|trans({}, translation_domain)} %}
    {{- block('base_widget_attributes') -}}
{% endblock widget_attributes %}

- Léo Benoist

Answer 4

这个东西能行吗？

{{ form_widget(form.yourFormField, {'attr': {'placeholder': twigVariableYouWantToUseAsPlaceHolder}}) }}

我通常使用form_widget函数来完全控制Symfony表单创建的HTML元素。

这里有一个更完整的例子： http://symfony.com/doc/current/cookbook/form/form_customization.html

- ILikeTacos

---

我认为他想要一个一次性的解决方案。使用这个，它必须为每个小部件执行此操作。 - ncrocfer

谢谢回复！是的，我在寻找一种通用的解决方案。 - jspizziri

Answer 5

你是否已经告诉Twig使用你的自定义模板来主题化表单？你可以在包含表单的每个页面中添加以下行来实现：

{% form_theme form 'AcmeDemoBundle:Form:fields.html.twig' %}

或者在你的config.yml文件中一次性为所有表单完成此操作：

twig:
    form:
        resources:
            - 'AcmeCoreBundle::fields.html.twig'

- Johann

---

我已经添加了Twig配置以使用我的自定义主题，它正在呈现我的主题，但我还没有按照我想要的方式呈现它 :P - jspizziri

Answer 6

也许在 widget_attributes 块中：

{% block widget_attributes %}
  {% spaceless %}

    {% set type = type|default('text') %}

    {% for attrname,attrvalue in attr %}{{attrname}}="{{attrvalue}}" {% endfor %} 

    {% if type == 'text' %}
        placeholder="{{ label|trans }}"
    {% endif %}

  {% endspaceless %}
{% endblock widget_attributes %}

- ncrocfer

---

如果我这样做，如何关闭非文本输入表单字段的标签呈现？ - jspizziri

Answer 7

我创建了一个Bootstrap包，其中有专门的选项。您可以搜索表单主题以查看如何实现labels_to_placeholders术语。

或者，如果您自己使用Bootstrap，请使用我的捆绑包。;)

- Elnur Abdurrakhimov

---

谢谢！我会去看一下，如果我成功了，我会接受你的答案。 - jspizziri