Twitter Bootstrap представляет два разных способа в двух разных проектах Rails 3.2.

Я использую SimpleForm и Twitter Bootstrap в двух проектах Rails 3.2. К сожалению, мои формы не отображаются должным образом в одном из проектов.

Все соответствующие драгоценные камни являются одинаковыми версиями.

Тот, который представлен правильно, имеет поля, которые выглядят так:

<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 заставляет их отображаться по-разному? Или это простая форма?


person AKWF    schedule 17.05.2012    source источник
comment
Скорее всего это SimpleForm. Можете ли вы опубликовать все, включая '‹form›'?   -  person Zepplock    schedule 17.05.2012


Ответы (2)


Я нашел проблему, хотя я до сих пор не уверен, почему это произошло. Это действительно была проблема SimpleForm, а не проблема Twitter Bootstrap.

Файлы config/initializers/simple_form.rb генерировались по-разному. Я не уверен, почему.

Во время установки я получил несколько ошибок, которые выдал MiniTest.

person AKWF    schedule 17.05.2012

Похоже, проблема в простой форме.

Twitter Bootstrap обрабатывает только стиль, SimpleForm генерирует html.

Вы уверены, что используете одну и ту же версию SimpleForm в обоих проектах? Или, может быть, вы забыли вызвать simple_form_for для более позднего.

РЕДАКТИРОВАТЬ:

После установки вы запустили генератор начальной загрузки Twitter?

rails generate simple_form:install --bootstrap
person André Barbosa    schedule 17.05.2012