Đường ray: Biểu mẫu đơn giản + bootstrap - Khi lỗi, trường không chuyển sang màu đỏ

Question

Tôi đã bắt đầu sử dụng Simple-form và Bootstrap và tôi đã cố gắng làm theo tham chiếu này: Simple form + Bootstrap nhưng tôi không biết điều gì đang diễn ra vì khi một trường là không, đây là những gì sẽ xảy ra:

về ảnh chụp màn hình này, tôi có một câu hỏi:
1) Như bạn thấy, lĩnh vực giá không được đỏ bao quanh. Làm thế nào tôi có thể làm điều đó? Đây là mã của tôi cho biểu mẫu:

<%= simple_form_for @lesson, :html => { :class => 'well' } do |lesson_form| %> 
<% if lesson_form.error_notification %> 
    <div class="alert alert-error fade in"> 
     <a class="close" data-dismiss="alert" href="#">&times;</a> 
     <%= lesson_form.error_notification %> 
    </div> 
<% end %> 
    <%= lesson_form.input :title %> 
    <%= lesson_form.input :category %> 
    <%= lesson_form.input :description %> 
    <%= lesson_form.input :price %> 
    <%= lesson_form.button :submit, :label => 'Create', :class => 'btn btn-primary btn-large' %> 
<% end -%> 

Answer 1

Tôi tin rằng mã trong tài liệu tham khảo của bạn có phần gây nhầm lẫn và không chính xác khi thông báo lỗi xuất hiện.

Thay đổi:

<% if lesson_form.error_notification %> 
    <div class="alert alert-error fade in"> 
     <a class="close" data-dismiss="alert" href="#">&times;</a> 
     <%= lesson_form.error_notification %> 
    </div> 
<% end %> 

đến, chỉ cần:

<%= lesson_form.error_notification %> 

Sau đó, trong config/locals/simple_form.en.yml, thay đổi default_message tới:

default_message: '<a class="close" data-dismiss="alert">&times;</a>Some errors were found, please take a look:' 

này sẽ sửa chữa các sự bất đối xứng trong các lỗi hộp cảnh báo (bằng cách sửa chữa đánh dấu kết quả).

Để khắc phục sự cố với lỗi xác thực của bạn không hiển thị bằng màu đỏ, bạn sẽ phải chia sẻ đánh dấu để chúng tôi có thể xem điều gì đang xảy ra.

Answer 2

Xem văn bản bên cạnh trường giá. Đơn giản để đặt các lỗi bên cạnh trường.

Để dọn dẹp các hình thức của bạn nhìn cố gắng tiếp theo:

Di này, nó không cần thiết với đơn giản dạng đá quý:

<% if lesson_form.error_notification %> 
    <div class="alert alert-error fade in"> 
     <a class="close" data-dismiss="alert" href="#">&times;</a> 
     <%= lesson_form.error_notification %> 
    </div> 
<% end %> 

Thay đổi của bạn :html => { :class => 'well' }-:html => { :class => 'well form-horizontal' }

này sẽ bố trí của bạn hình thành tốt hơn và áp dụng css bootstrap vào các trường và văn bản lỗi.