使用 Symfony 自定义表单

Customizing a form with Symfony

我已经使用 bootstrap 创建了一个表单,但我想通过添加 class 等来自定义它。我在文档上什么也没找到。

这是 HTML 中的正常形式:

<form id="form" method="POST">
                        <div class="form-group">
                            <label class="control-label">Pseudo</label>
                            <div class="input-group">
                                <span class="input-group-addon"><span class="glyphicon glyphicon-user"></span></span>
                                <input class="form-control" placeholder="xX_Pseudo_Cool_93_Xx" name="form[username]" id="emailSignUp" type="email" required="required">
                            </div>
                        </div>
                        <div class="form-group">
                            <label class="control-label">Email</label>
                            <div class="input-group">
                                <span class="input-group-addon"><span class="glyphicon glyphicon-user"></span></span>
                                <input class="form-control" placeholder="email@example.com" name="form[email]" id="emailSignUp" type="email" required="required">
                            </div>
                        </div>
                        <div class="form-group">
                            <label class="control-label" for="password">Mot de passe</label>
                            <div class="input-group">
                                <span class="input-group-addon"><span class="glyphicon glyphicon-lock"></span></span>
                                <input class="form-control" placeholder="Mot de passe" name="password" id="password" type="password" required>
                            </div>
                        </div>
                        <div class="form-group">
                            <label class="control-label" for="password">Confirmer le mot de passe</label>
                            <div class="input-group">
                                <span class="input-group-addon"><span class="glyphicon glyphicon-lock"></span></span>
                                <input class="form-control" placeholder="Confirmer le mot de passe" name="passwordConfirm" id="passwordConfirm" type="password" required>
                            </div>
                        </div>
                        <div class="checkbox">
                            <label>
                                <input id="term" type="checkbox" required>
                                En créant votre compte, vous acceptez nos <a href="{{ path('policy') }}">termes et conditions & politique de confidentialité</a>
                            </label>
                        </div>
                        <button type="submit" id="btnsignup" class="btn btn-primary" style="width: 127px;">S'inscrire</button>
                    </form>

这是实际有效的表单,但它没有任何内容,而且它是与 Symfony 一起使用的:

{{ form_start(form) }}
    {{ form_row(form.username) }}
    {{ form_row(form.email) }}
    {{ form_row(form.plainPassword.first) }}
    {{ form_row(form.plainPassword.second) }}

    <button type="submit">Register!</button>
{{ form_end(form) }}    

所以,我想做的是根据我的 HTML.

实际定制 Symfony 表单

感谢阅读。

您需要像文档中那样声明表单 https://symfony.com/doc/4.1/forms.html

使用表单 class 或在控制器中使用表单生成器(表单 class 是更好的选择)。

然后,在定义字段时使用以下代码:

->add('subtitle', 'text',
           array(
               'label'          => 'Subtitle',
               'attr'           => array(
                   'placeholder' => 'The subtitle',
                   'class' => 'form-control'
               ),
               'required'       => false,
           )

您可以在选项的 attr 部分指定将在 html 文件中呈现 class 的 class 键。

另一种方法是在模板中设置 class。为此,不是调用 form_row(form.username),而是仅使用传递属性的字段调用渲染函数,如下所示:

<div class="form-group">
    {{ form_label(form.username, null, {"label_attr": {"class": "col-sm-2 control-label" }}) }}

    <div class="col-sm-10">
        {{ form_widget(form.username, {"attr": {"class": "form-control" } }) }}
    </div>
</div>

这里有更多信息:https://symfony.com/doc/current/form/form_customization.html