使用Symfony自定义表单

Question

我已经使用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表单。

谢谢阅读。

Answer 1

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

使用表单类或在控制器中使用表单构建器（表单类是更好的选择）。

然后，在定义字段时，请使用以下代码：

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

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

另一种方法是在模板中设置类。 为此，您不必调用form_row(form.username) ，而仅使用传递如下属性的字段来调用render函数：

<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