0

我在两个 Rails 3.2 项目中使用 SimpleForm 和 Twitter Bootstrap。不幸的是,我的表单在其中一个项目中没有正确呈现。

所有相关的宝石都是相同的版本。

正确显示的字段如下所示:

<form id="new_user" class="simple_form form-horizontal" novalidate="novalidate" method="post" action="/users" accept-charset="UTF-8" name="new_user">
    <div style="margin:0;padding:0;display:inline">
        <input type="hidden" value="✓" name="utf8"> <input type="hidden" value="I/WorRCjNpv7gnccGkL6/LETTgn6ao6Ycrgm0ky2slM=" name="authenticity_token">
    </div>
    <div class="control-group string required">
        <label class="string required control-label" for="user_first_name"><abbr title="required">*</abbr> First name</label>
        <div class="controls">
            <input id="user_first_name" class="string required" type="text" size="50" name="user[first_name]">
        </div>
    </div>
    <div class="control-group string required">
        <label class="string required control-label" for="user_last_name"><abbr title="required">*</abbr> Last name</label>
        <div class="controls">
            <input id="user_last_name" class="string required" type="text" size="50" name="user[last_name]">
        </div>
    </div>
    <div class="control-group email required">
        <label class="email required control-label" for="user_email"><abbr title="required">*</abbr> Email</label>
        <div class="controls">
            <input id="user_email" class="string email required" type="email" size="50" name="user[email]">
        </div>
    </div>
    <div class="control-group password required">
        <label class="password required control-label" for="user_password"><abbr title="required">*</abbr> Password</label>
        <div class="controls">
            <input id="user_password" class="password required" type="password" size="50" name="user[password]">
        </div>
    </div>
    <div class="control-group password optional">
        <label class="password optional control-label" for="user_password_confirmation">Password confirmation</label>
        <div class="controls">
            <input id="user_password_confirmation" class="password optional" type="password" size="50" name="user[password_confirmation]">
        </div>
    </div>
    <div class="control-group boolean optional">
        <label class="boolean optional control-label" for="user_admin">Admin</label>
        <div class="controls">
            <input type="hidden" value="0" name="user[admin]"> <label class="checkbox"><input id="user_admin" class="boolean optional" type="checkbox" value="1" name="user[admin]"></label>
        </div>
    </div>
    <div class="control-group string required">
        <label class="string required control-label" for="user_company"><abbr title="required">*</abbr> Company</label>
        <div class="controls">
            <input id="user_company" class="string required" type="text" size="50" name="user[company]">
        </div>
    </div>
    <div class="form-actions">
        <input class="btn btn-primary" type="submit" value="Create User" name="commit"> <a class="btn" href="/users"><span class="translation_missing" title="translation missing: en.helpers.links.cancel">Cancel</span></a>
    </div>
</form>

而不正确的则呈现如下:

<form id="new_user" class="simple_form form-horizontal" novalidate="novalidate" method="post" action="/users" accept-charset="UTF-8" name="new_user">
    <div style="margin:0;padding:0;display:inline">
        <input type="hidden" value="✓" name="utf8"> <input type="hidden" value="TR4q4W8cEl82hI6+bebVsoYp8WD3k2xsyhhf1UXzCYg=" name="authenticity_token">
    </div>
    <div class="input string required">
        <label class="string required control-label" for="user_first_name"><abbr title="required">*</abbr> First name</label> <input id="user_first_name" class="string required" type="text" size="50" name="user[first_name]">
    </div>
    <div class="input string required">
        <label class="string required control-label" for="user_last_name"><abbr title="required">*</abbr> Last name</label> <input id="user_last_name" class="string required" type="text" size="50" name="user[last_name]">
    </div>
    <div class="input email required">
        <label class="email required control-label" for="user_email"><abbr title="required">*</abbr> Email</label> <input id="user_email" class="string email required" type="email" size="50" name="user[email]">
    </div>
    <div class="input password required">
        <label class="password required control-label" for="user_password"><abbr title="required">*</abbr> Password</label> <input id="user_password" class="password required" type="password" size="50" name="user[password]">
    </div>
    <div class="input password optional">
        <label class="password optional control-label" for="user_password_confirmation">Password confirmation</label> <input id="user_password_confirmation" class="password optional" type="password" size="50" name="user[password_confirmation]">
    </div>
    <div class="input boolean optional">
        <input type="hidden" value="0" name="user[admin]"> <label class="boolean optional control-label checkbox" for="user_admin"><input id="user_admin" class="boolean optional" type="checkbox" value="1" name="user[admin]"> Admin</label>
    </div>
    <div class="form-actions">
        <input class="btn btn-primary" type="submit" value="Create User" name="commit"> <a class="btn" href="/users"><span class="translation_missing" title="translation missing: en.helpers.links.cancel">Cancel</span></a>
    </div>
</form>

我在两个项目上都遵循了相同的步骤(据我所知)。为什么 Twitter Bootstrap 会导致两者呈现不同?还是 SimpleForm?

4

2 回答 2

0

看起来问题出在简单的形式上。

Twitter Bootstrap 只处理样式,SimpleForm 生成 html。

您确定在两个项目中使用相同版本的 SimpleForm 吗?或者您可能忘记在后一个上调用 simple_form_for。

编辑:

安装后你是否运行了 twitter 引导生成器?

rails generate simple_form:install --bootstrap
于 2012-05-17T16:48:18.157 回答
0

我发现了问题,尽管我仍然不确定它为什么会发生。这确实是一个 SimpleForm 问题,而不是 Twitter Bootstrap 问题。

config/initializers/simple_form.rb 文件在两者之间生成不同。我不确定为什么。

我在安装过程中确实遇到了一些由 MiniTest 引发的错误。

于 2012-05-17T17:05:03.380 回答