如何覆盖fosuserbundle注册表单样式

时间:2013-04-07 05:45:27

标签: twitter-bootstrap fosuserbundle symfony-2.2

我想在fosuserbundle注册表单中使用bootstrap样式。并且登录不能覆盖,但由于注册表单使用“{{form_widget(form)}}”,所以我无法覆盖它,我使用symfony2。 2,我也测试使用表单主题,像这样

{% block form_row %}
{% spaceless %}
<div class="control-group">
    {{ form_label(form, label|default(null),{ 'attr': {'class': 'control-label'} }) }}
    {{ form_errors(form) }}
    <div class="controls">{{ form_widget(form) }}</div>
</div>
{% endspaceless %}
{% endblock form_row %}

在表单模板中    代码是

{% form_theme form with '@user/form/fields.html' %}
{% trans_default_domain 'FOSUserBundle' %}
<form action="{{ path('fos_user_registration_register') }}" {{ form_enctype(form) }} method="POST" class="fos_user_registration_register form-horizontal form-box">
    {{ form_widget(form) }}
    <div>
        <input type="submit" value="{{ 'registration.submit'|trans }}" />
    </div>
</form>

但输出此

  |form action="/register/"  method="POST" class="fos_user_registration_register form-horizontal form-box"|
        |div id="fos_user_registration_form"|
            |div class="control-group"|
                |label for="fos_user_registration_form_username" class="required"|用户名:|/label|
                |div class="controls"|
                    |input type="text" id="fos_user_registration_form_username" name="fos_user_registration_form[username]" required="required" /|    
                |/div|
            |/div|
            |div class="control-group"|
                |label for="fos_user_registration_form_email" class="required"|电子邮箱:|/label|
                |div class="controls"|
                    |input type="email" id="fos_user_registration_form_email" name="fos_user_registration_form[email]" required="required" /|    
                |/div|
            |/div|
            |div class="control-group"|
                |label for="fos_user_registration_form_plainPassword_first" class="required"|密码:|/label|
                |div class="controls"|
                    |input type="password" id="fos_user_registration_form_plainPassword_first" name="fos_user_registration_form[plainPassword][first]" required="required" /|    
                |/div|
            |/div|
            |div class="control-group"|
                |label for="fos_user_registration_form_plainPassword_second" class="required"|确认密码:|/label|
                |div class="controls"|
                    |input type="password" id="fos_user_registration_form_plainPassword_second" name="fos_user_registration_form[plainPassword][second]" required="required" /|    
                |/div|
            |/div|
            |input type="hidden" id="fos_user_registration_form__token" name="fos_user_registration_form[_token]" value="622a4c73bfc48b4944c5b97ff4fc46c7fa8e9e91" /|    
        |/div|
        |div|
            |input type="submit" value="注册" /|    
        |/div|
    |/form|

它不是我想要的,所以我能做些什么呢?thx!

3 个答案:

答案 0 :(得分:0)

尝试使用:

https://symfony.com/doc/master/bundles/FOSUserBundle/overriding_forms.html 捆绑的FOS用户将文档移动到symfony.com docs。

编辑:更新链接

答案 1 :(得分:0)

您可以渲染表单的每个部分而不是form_widget(表单)

F:\Selenium2\Protractor\TypeScriptProject\ConvertedJSFiles\build>gulp run-prot
F:\Selenium2\Protractor\TypeScriptProject\node_modules\.bin is the protractor directory ***
[18:16:17] Using gulpfile F:\Selenium2\Protractor\TypeScriptProject\ConvertedJSFiles\build\gulpfile.js
[18:16:18] Starting 'run-prot'...
About to run the specs...........
[18:16:18] Finished 'run-prot' after 106 ms
[18:16:20] E/configParser - Error code: 105
[18:16:20] E/configParser - Error message: failed loading configuration file ConvertedJSFiles/config/config.js
[18:16:20] E/configParser - Error: Cannot find module 'F:\Selenium2\Protractor\TypeScriptProject\ConvertedJSFiles\build\Convert
edJSFiles\config\config.js'
    at Function.Module._resolveFilename (module.js:469:15)
    at Function.Module._load (module.js:417:25)
    at Module.require (module.js:497:17)
    at require (internal/module.js:20:19)
    at ConfigParser.addFileConfig (F:\Selenium2\Protractor\TypeScriptProject\node_modules\protractor\built\configParser.js:125:
26)
    at Object.initFn [as init] (F:\Selenium2\Protractor\TypeScriptProject\node_modules\protractor\built\launcher.js:93:22)
    at Object.<anonymous> (F:\Selenium2\Protractor\TypeScriptProject\node_modules\protractor\built\cli.js:112:10)
    at Module._compile (module.js:570:32)
    at Object.Module._extensions..js (module.js:579:10)
    at Module.load (module.js:487:32)

F:\Selenium2\Protractor\TypeScriptProject\ConvertedJSFiles\build\gulpfile.js:11
        throw e;
        ^
Error: protractor exited with code 105

更多信息在这里:

https://github.com/FriendsOfSymfony/FOSUserBundle/issues/1077

答案 2 :(得分:0)

你可以这样做:

<form action="{{ path('fos_user_registration_register') }}" {{ form_enctype(form) }} method="POST">
<div class="form-group" id="fos_user_registration_form">
    {{ form_widget(form.email, { 'attr': {'class': 'form-control', 'placeholder': 'form.email'|trans } }) }}
    {{ form_errors(form.email) }}

    {{ form_widget(form.username, { 'attr': {'class': 'form-control', 'placeholder': 'form.username'|trans } }) }}
    {{ form_errors(form.username) }}

    {{ form_widget(form.plainPassword.first, { 'attr': {'class': 'form-control', 'placeholder': 'form.password'|trans } }) }}
    {{ form_errors(form.plainPassword.first) }}

    {{ form_widget(form.plainPassword.second, { 'attr': {'class': 'form-control', 'placeholder': 'form.password_confirmation'|trans } }) }}
    {{ form_errors(form.plainPassword.second) }}

    {{ form_rest(form) }}

</div>
<div>
    <input class="btn btn-lg btn-primary btn-block" type="submit" value="{{ 'registration.submit'|trans }}">
</div>