form-horizo​​ntal不能與bootstrap-sass護欄一起使用gem

Question

我從設計gem中獲取並編輯了以下new.html.erb。

<h2>Sign in</h2> 

<%= simple_form_for(resource, as: resource_name, url: session_path(resource_name), html:{class: "form-horizontal"}) do |f| %> 

<%= f.input :email%> 
<%= f.input :password%> 
<%= f.input :remember_me, as: :boolean%> 

<div class = "form-actions"> 
    <%= f.submit "Sign In", class: "btn btn-primary btn-lg"%> 
</div> 
<% end %> 

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

但它返回以下代替http://imgur.com/3l4rLTW

中顯示的圖片，表格沒有考慮在自舉形式的水平屬性。表單描述是在上面而不是在旁邊，並且不知何故複選框在右邊。

我做錯了什麼？我正在關注One Month rails教程，並且在我跟着視頻一起工作時，它很有用。

Answer 1

您的代碼缺少很多classes以便正確顯示。

Bootstrap Form-Horizontal Doc

<div class="panel panel-default"> 
    <div class="panel-heading"> 
     <div class="panel-title"> 
      <h1>Sign in</h1> 
     </div> 
    </div> 
    <div class="panel-body"> 
     <%= form_for(resource, :as => resource_name, :url => session_path(resource_name)) do |f| %> 

      <div class="form-group"> 
      <%= f.label :email %> 
      <%= f.email_field :email, class: "form-control", :autofocus => true %> 
      </div> 

      <div class="form-group"> 
      <%= f.label :password %> 
      <%= f.password_field :password, class: "form-control" %> 
      </div> 

     <div class="form-group"> 
      <div class="checkbox"> 
       <%= f.check_box :remember_me %> 
       <%= f.label :remember_me %> 
      </div> 
     </div> 

      <div class="form-group"> 
      <%= f.submit "Sign in", class: "btn btn-primary" %> 
      </div> 
     <% end %> 
    </div> 
    <div class="panel-footer"> 
     <%= render "devise/shared/links" %> 
    </div> 
</div> 

Answer 2

我發現有一個與紅寶石寶石的問題......當您運行包安裝將gem 'simple_form'到您的寶石文件之後，它仍然會安裝3.0.2版，而不是來自github的最新版本（3.1rc）。

你可以做的是你的Gemfile內安裝這個：gem 'simple_form', github: 'plataformatec/simple_form', branch: 'master'

然後運行bundle安裝。它應該更新你的寶石到正確的版本（3.1rc）。然後，再次運行rails generate simple_form:install --bootstrap。每當衝突停止時，輸入'y'，然後按回車鍵以覆蓋導致衝突的舊的初始化文件。終止導軌服務器，然後重新打開它。如果你的代碼是正確的，你應該很好地去看看有效的bootstrap簡單表單。

例如：

'<%= simple_form_for(@story, html: { class: 'form-horizontal' }) do |f| %>`