Rails錯誤消息打破註冊表單

Question

我正在關注本教程：http://ruby.railstutorial.org/chapters/sign-up#top，並且我對rails的錯誤消息的樣式有問題。

我想做到這一點：

但不是我的形式突破，我得到這個醜陋的形式：

我查了源代碼，並有使用nov div標籤代替標籤和輸入：

如何覆蓋該行爲並完成該表單只會在教程中突出顯示？

謝謝。

編輯1：

我發現問題出在哪裏。我正在使用Bootstrap 3.1.0，並且擴展在那裏不起作用。所以，這是行不通的：

#error_explanation { 
    color: #f00; 
    ul { 
    list-style: none; 
    margin: 0 0 18px 0; 
    } 
} 

.field_with_errors { 
    @extend .control-group; 
    @extend .error; 
} 

正因爲這個代碼並不像它應該工作：

<% if @user.errors.any? %> 
    <div id="error_explanation"> 
    <div class="alert alert-error"> 
     The form contains <%= pluralize(@user.errors.count, "error") %>. 
    </div> 
    <ul> 
    <% @user.errors.full_messages.each do |msg| %> 
     <li>* <%= msg %></li> 
    <% end %> 
    </ul> 
    </div> 
<% end %> 

我不能找到一種方法，使這種延長工作。像控制組不存在...

編輯2：

好吧，當我將此代碼添加到config/environment.rb形式不破，但不能做到圍繞表單紅線是哪裏不對輸入：

ActionView::Base.field_error_proc = Proc.new do |html_tag, instance| 
    html_tag.html_safe 

Answer 1

你爲什麼要使用引導3？本教程告訴你在你的Gemfile使用

gem 'bootstrap-sass', '2.3.2.0' 

。你真的應該這樣做，因爲這個教程爲你提供了很多代碼，這些代碼是用於Bootstrap 2的。當然，它會與Bootstrap 3一起使用。如果你真的想使用B3，你將不得不改變很多在您的意見中幾乎沒有類名。在其他的變化做到這一點：

• 變化div class="alert alert-error"到
• 適用form-group和form-control類表單字段（見例如here）。

• 在你的CSS：

  .field_with_errors { 
      @extend .has-error; 
  } 
  

• 然後做的所有其他更改提到here。

Answer 2

這似乎是一個相當普遍的錯誤 - 你曾經試過以下任一：

• Rails field_with_errors and Bootstrap form-horizontal
• Ruby field_with_errors doesn't @extend .control-group .error

@extend documentation

---

預編譯

如果做不到這一點，你不妨試試資產預編譯：

#config/environments/production.rb 
config.serve_static_assets = true 
config.assets.compile = false 

$ rake assets:precompile RAILS_ENV=production 

---

個

混入

這不會直接修復它，但你可以創建的樣式的混入，幷包括如下：

@mixin error { 
    display: block; 
    etc 
} 

.field_with_errors { 
    @extend .control-group; 
    @extend .error; 
}