Question

为什么在呈现页面时不会显示“well”类？

<div class="container">
  <div class="row">
    <div class="offset4 span4">
      <h2>Sign up</h2>

      <%= form_for(resource, :html => { :class => "well" }, :as => resource_name, :url => registration_path(resource_name)) do |f| %>
        <%= devise_error_messages! %>

        <div><%= f.label :email %><br />
        <%= f.email_field :email %></div>

        <div><%= f.label :password %><br />
        <%= f.password_field :password %></div>

        <div><%= f.label :password_confirmation %><br />
        <%= f.password_field :password_confirmation %></div>

        <div><%= f.submit "Sign up" %></div>
      <% end %>

      <%= render "devise/shared/links" %>
    </div>
  </div>
</div>

渲染时表单如下所示：

    <form method="post" id="new_user" class="new_user" action="/users" accept-charset="UTF-8"><div style="margin:0;padding:0;display:inline"><input type="hidden" value="✓" name="utf8"><input type="hidden" value="P3KHtU5CRNy0/kVEvck4coilSOWCHYaKPZ5D1xCxQj4=" name="authenticity_token"></div>


        <div><label for="user_email">Email</label><br>
        <input type="email" value="" size="30" name="user[email]" id="user_email"></div>

        <div><label for="user_password">Password</label><br>
        <input type="password" size="30" name="user[password]" id="user_password"></div>

        <div><label for="user_password_confirmation">Password confirmation</label><br>
        <input type="password" size="30" name="user[password_confirmation]" id="user_password_confirmation"></div>

        <div><input type="submit" value="Sign up" name="commit"></div>
</form>

通知类只是“new_user”。没有“好”，为什么以及如何解决它？

由于

更新：

我已将其更新为：

  <%= form_for(resource, :class => "well", :as => resource_name, :url => registration_path(resource_name)) do |f| %>

呈现HTML：

<form method="post" id="new_user" class="new_user" action="/users" accept-charset="UTF-8"><div style="margin:0;padding:0;display:inline"><input type="hidden" value="✓" name="utf8"><input type="hidden" value="P3KHtU5CRNy0/kVEvck4coilSOWCHYaKPZ5D1xCxQj4=" name="authenticity_token"></div>

仍然无法正常工作。使用Rails 3.2.8 即使这些文件是ERB，也在应用程序的其余部分使用HAML。可能是吗？

Answer 1

实际上你的form_for没有附加该类的原因是因为使用form_for，你需要在：html哈希中声明它：

form_for(resource, :html => {:class => "well"}, :as => resource_name, :url => registration_path(resource_name)) do

api.rubyonrails.org form_for，阅读描述三个哈希选项的段落（：url，：namespace和：html）

Answer 2

对于遇到此问题的其他人，Speed的解决方案对我有用。

我决定分享我的工作解决方案的代码。让我的应用看起来像http://twitter.github.com/bootstrap/examples/signin.html

我将/views/devise/sessions/new.html.erb修改为：

<%= form_for(resource, :as => resource_name, :html => {class:"form-signin"}, :url => session_path(resource_name)) do |f| %>
<h2 class:"form-signin-heading">Please sign in</h2>
<%= f.email_field :email, :autofocus => true, class:"input-block-level", placeholder:"Email address" %>
<%= f.password_field :password, class:"input-block-level", placeholder:"Password"%>

<% if devise_mapping.rememberable? -%> 
    <label class="checkbox">
        <%= f.check_box :remember_me %> Remember Me
    </label>
<% end -%>

<%= f.submit "Sign in", class:"btn btn-large btn-primary" %>

<hr>

<%= render "devise/shared/links" %><% end %>

不要忘记将引导程序示例中的css添加到/ assets / css中注意，使用[type =“email”]而不是引导示例中的[type =“text”]。

.form-signin {
    max-width: 300px;
    padding: 19px 29px 29px;
    margin: 40px auto 20px;
    background-color: #fff;
    border: 1px solid #e5e5e5;
    -webkit-border-radius: 5px;
       -moz-border-radius: 5px;
            border-radius: 5px;
    -webkit-box-shadow: 0 1px 2px rgba(0,0,0,.05);
       -moz-box-shadow: 0 1px 2px rgba(0,0,0,.05);
            box-shadow: 0 1px 2px rgba(0,0,0,.05);
}

.form-signin .form-signin-heading,
.form-signin .checkbox {
    margin-bottom: 10px;
}

.form-signin input[type="email"],
.form-signin input[type="password"] {
    font-size: 16px;
    height: auto;
    margin-bottom: 15px;
    padding: 7px 9px;
}

快乐的编码！

Answer 3

潜在的问题是无法修改视图。它不仅限于我在form_for中正确声明的类。正确答案： Customizing Devise views in Rails 这是更高票数的答案。

我无法修改视图，因为我跑了

rails generate devise:views User

应该是

rails generate devise:views

请注意，没有提及用户。

Answer 4

<%= form_for(resource, :class => "well", :as => resource_name, :url => registration_path(resource_name)) do |f| %>

Answer 5

应用自定义样式的方法（使用Devise 3.5.3以及当您拥有多个Devise模型时）是在config/initializers/devise.rb中启用作用域视图。

默认为false。将其更改为：

config.scoped_views = true

无法使用Twitter Bootstrap添加“well”类来设计注册表单（form_for）

5 个答案: