Symfony：使用 CSS 格式化 FORMS 的简单方法？

Question

我们正在使用 Symfony 2 构建一个网站。我们生成一个唯一的 URL 并通过电子邮件将其发送给忘记密码的用户，以便他们可以重设密码。

我们正在构建一个简单的表单来重设密码。我们有两个标签（'Enter your new password' 和 'Enter your new password again'），每个标签旁边都有一个文本框。

我们希望文本框相互对齐。

懒惰的解决方案是找出两个长度相同的字符串 (!)

但我想用 CSS 格式化它们或将它们放在 table ...

用 Symfony 的形式完全可以吗？我阅读了有关自定义模板的文档，但是当我们尝试 Symfony 文档提出的解决方案时，小部件（文本框）没有呈现...

以下是问题的一些图片：

Crooked textboxes

Lazy solution

这是我认为（！）应该完成格式化的树枝代码

{% block blockPrincipal_mp %}
<h1>{{ titre }}</h1>
{{ form_start(form) }}


<div class="containerForm">
    <div class="error">
        {{ form_errors(form) }}
    </div>
    {{ form_rest(form) }}





    {{ form_end(form) }}
    {% for flashMessage in app.session.flashbag.get('success') %}
        <div class="confirm"><p>    {{ flashMessage }}</p></div>
    {% endfor %}
        </div>
{% endblock %}

Answer 1

您可以单独呈现表单的所有不同元素，而不是像示例中那样使用 form_rest(form) 一次性呈现所有元素。 form_rest() 将渲染尚未渲染的内容。到目前为止，所有呈现的都是错误。

我不知道你的表格属性的名字是什么，但这里有一个例子：

{{ form_start(form) }}

    <div class="form_errors">{{ form_errors(form) }}</div>

    {# output all pieces of the username element individually #}
    <div class="form_label">{{ form_label(form.username) }}</div>
    <div class="form_input">{{ form_widget(form.username) }}</div>
    <div class="form_errors">{{ form_errors(form.username) }}</div>

    {# output all pieces of the password element individually #}
    <div class="form_label">{{ form_label(form.password) }}</div>
    <div class="form_input">{{ form_widget(form.password) }}</div>
    <div class="form_errors">{{ form_errors(form.password) }}</div>

    {{ form_rest(form) }}

{{ form_end(form) }}

通过这种方式，您可以控制 HTML 包装器包围您的每个表单元素。

请注意，您还可以输出用户名和密码字段...

{{ form_row(form.username) }} {{ form_row(form.password) }}

...它仍然会输出标签、小部件和错误，但会为在您的 Twig 模板中定义的那些表单类型使用默认布局。因此，如果您单独进行渲染，您可以更好地控制渲染部分。

这非常适合自定义表单和自定义模板，但是如果您希望通过扩展表单域模板更好地控制单个表单元素在整个站点中的呈现方式，您也可以覆盖默认表单元素的布局。

https://symfony.com/doc/current/form/form_customization.html

Answer 2

RepeatedType字段可以单独显示：

{{ form_row(form.password.first) }}
{{ form_row(form.password.second) }}

以上控制：

{{ form_label(form.password.first) }}
{{ form_widget(form.password.first) }}

{{ form_label(form.password.second) }}
{{ form_widget(form.password.second) }}

Symfony：使用 CSS 格式化 FORMS 的简单方法？

Symfony : easy way to format FORMS with CSS?

symfony-forms

symfony