设计错误消息未显示Bootstrap模板

时间:2015-04-05 04:35:07

标签: ruby-on-rails twitter-bootstrap devise

我正在使用Wrapbootstrap下载模板,设计用户注册并登录但是没有弹出任何错误。

在我设计的所有观点中,我都在调用<%= devise_error_messages! %GT;

在我的模型中,以下验证:

    validates :first_name, presence: true
    validates :last_name, presence: true
    validates :phone_number, presence: true

这是我的Devise_helper.rb

    module DeviseHelper
   def devise_error_messages!
   return '' if resource.errors.empty?

    messages = resource.errors.full_messages.map { |msg| content_tag(:li, msg) }.join
    html = <<-HTML
   <div class="alert alert-error alert-block"> <button type="button"
    class="close" data-dismiss="alert">x</button>
   #{messages}
    </div>
    HTML

    html.html_safe
   end
 end

这是我的注册新视图页面:

          <!--=== Content Part ===-->
         <div class="container content">
         <div class="row">
         <div class="col-md-6 col-md-offset-3 col-sm-8 col-sm-offset-2">
         <form class="reg-page">
         <div class="reg-header">
         <h2>Register a new account</h2>
         <p>Already Signed Up? Click <%= link_to "Sign In", login_url %> to login your account.</p>
         </div>
        <%= form_for(resource, as: resource_name, url: registration_path(resource_name)) do |f| %>
        <%= devise_error_messages! %>

        <label>First Name<span class="color-red">*</span></label>
        <%= f.text_field :first_name, autofocus: true, :class=> "form-control margin-bottom-20" %>

        <label>Last Name<span class="color-red">*</span></label>
        <%= f.text_field :last_name, autofocus: true, :class=> "form-control margin-bottom-20" %>

        <label>Phone Number<span class="color-red">*</span></label>
        <%= f.text_field :phone_number, autofocus: true, :class=> "form-control margin-bottom-20" %>

        <label>Email Address <span class="color-red">*</span></label>
        <%= f.email_field :email, autofocus: true, :class=> "form-control margin-bottom-20" %>

        <div class="row">
        <div class="col-sm-6">
        <label>Password <span class="color-red">*</span></label>
        <% if @validatable %>
        <em>(<%= @minimum_password_length %> characters minimum)</em>
        <% end %>
        <%= f.password_field :password, autocomplete: "off", :class=> "form-control margin-bottom-20" %>
      </div>

        <div class="col-sm-6">
        <label>Confirm Password <span class="color-red">*</span></label>
        <%= f.password_field :password_confirmation, autocomplete: "off",:class=> "form-control margin-bottom-20" %>
        </div>
        </div>

         <hr>

         <div class="row">
         <div class="col-lg-6 text-right">
         <%= f.submit "Sign up", :class=> "btn-u" %>
         </div>
        </div>
        </form>
        </div>
        </div>
        <% end %>
        </div><!--/container-->
        <!--=== End Content Part ===-->

当我提交不完整的表单时,会生成如下查询字符串:http://localhost:3000/login?utf8=%E2%9C%93&authenticity_token=v%2BKndd3om3fBChpsZ6riw%2FVBiVM1ehVbKgBF9tIlg6PB6p30oei7OU3toqthjU1TY67yI3gmzjigxGe5DWfX7w%3D%3D&user%5Bemail%5D=&user%5Bpassword%5D=fwf&user%5Bremember_me%5D=0&commit=Log+in

2 个答案:

答案 0 :(得分:1)

在帮助文件中尝试使用它:

message_html << "<div class="alert alert-error alert-block"> <button type="button" class="close" data-dismiss="alert">x</button>"
message_html.html_safe

另外,请检查布局页面或相应登录页面中的flash消息:

  <% if flash[:alert] %>
    <span class='flash_error'> <%= flash[:alert] %></span>
  <% end %>

答案 1 :(得分:0)

这是因为我使用的模板有自己的Javascript用于覆盖设计错误消息的错误消息。在我删除Wrapbootstrap模板中包含的JS之后,两个错误消息都没有出现,现在它可以正常工作