Question

我正在尝试将我的用户模型验证错误显示为与其对应的表单字段内联。我正在使用bootstrap和设计。我有客户端验证，所以它不会让你提交注册表单，直到满足大多数验证。问题是当用户通过omniauth与facebook注册时。 Omniauth将采用facebook给我的字段并将其用于用户，但facebook不提供的字段会在页面顶部引发难看的错误。我一直试图找到一种让内联显示的方法。

这是我的用户模型：

class User < ActiveRecord::Base

    has_many :bills, :dependent => :destroy

    validates :cell_phone, presence: true
    validates :cell_phone, length: { is: 10 }
    validates :cell_phone, :numericality => {:only_integer => true}
    validates :first_name, presence: true
    validates :last_name, presence: true
    validates :terms, presence: true

    geocoded_by :last_sign_in_ip
    after_validation :geocode


    # Include default devise modules. Others available are:
    # :confirmable, :lockable, :timeoutable and :omniauthable
    devise :database_authenticatable, :registerable, :omniauthable,
    :recoverable, :rememberable, :trackable, :validatable



    def ability
    @ability ||= Ability.new(self)
    end

    delegate :can?, :cannot?, :to => :ability



    def self.from_omniauth(auth)
        where(auth.slice(:sprovider, :uid)).first_or_create do |user|
            user.sprovider = auth.provider
            user.uid = auth.uid
            user.first_name = auth.info.first_name
            user.last_name = auth.info.last_name
            user.email = auth.info.email
            user.cell_phone = auth.info.cell_phone
            user.avatar = auth.info.image
        end
    end

这是设计注册表单，我希望内联错误出现在：

<div class="row sign_in">
  <div class="col-md-6 col-md-offset-3 col-lg-4 col-lg-offset-4">


    <%= form_for(resource, as: resource_name, url: registration_path(resource_name)) do |f| %>
    <%= devise_error_messages! %>


  <div class="row">
    <div class="form-group">
      <div class="col-md-6">  
        <%= f.text_field :first_name, autofocus: true , class:'form-control',placeholder:'First Name *' , :required => true %>
      </div>

      <div class="col-md-6">
        <%= f.text_field :last_name, class:'form-control',placeholder:'Last Name*' , :required => true %>
      </div>
    <div class="row">
    </div>
  </div>
</div>
  <div class="form-group">
      <%= f.phone_field :cell_phone, class:'form-control',placeholder:'Mobile Number*(Solely for notification purposes)', :required => true, :maximum => 10, :minimum => 10 %>
  </div>

   <div class="form-group">
      <%= f.email_field :email, class:'form-control',placeholder:'Email*', :required => true %>
  </div>

  <% if f.object.password_required? %>
    <div class="form-group">
      <% if @validatable %><i></i><% end %>
      <%= f.password_field :password, autocomplete: "off", class:'form-control',placeholder:'Password* (8 characters minimum)', id:"myPassword", :required => true %>
    </div>

    <div class="form-group">
      <%= f.password_field :password_confirmation, autocomplete: "off", class:'form-control',placeholder:'Password Confirmation*', :required => true %>
    </div>
  <% end %>
  <div class="form-group">
    <%= f.check_box :terms%>
    I have read and agreed the User

<a href="#" data-toggle="modal" data-target=".bs-example-modal-sm">Terms and Conditions</a>
         <div class="modal fade bs-example-modal-sm" tabindex="-1" role="dialog" aria-labelledby="mySmallModalLabel" aria-hidden="true">
          <div class="modal-dialog modal-md">
            <div class="modal-content">
              <p>
  Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec pretium libero eget posuere ornare. Donec rutrum augue eu erat fringilla posuere. Aenean tempus dui a erat facilisis posuere. Pellentesque eget nulla et turpis mollis egestas. Donec molestie consequat ultricies. Vivamus in feugiat risus. Ut a quam id sapien fringilla efficitur eget in justo. Suspendisse tincidunt libero metus. Sed ultrices auctor diam mattis pretium. Integer in aliquam dui. Praesent pulvinar ante non urna consectetur, eget porta lorem porta. Etiam ac orci pretium, faucibus neque vel, egestas velit. Nullam condimentum ultrices imperdiet. Maecenas vel nisi commodo, bibendum purus dapibus, porttitor felis.

Nullam nec porta lectus. Vivamus porta lobortis justo, sed cursus arcu tincidunt et. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Pellentesque a rhoncus tellus. Ut mollis orci quis lacus consequat, quis varius nunc auctor. Ut elit ligula, bibendum quis mauris a, ornare elementum dui. Phasellus commodo ipsum eu augue consequat porta.</p>
            </div>
          </div>
        </div>
        </div>

  <div><i class="icon-heart"></i></div>
    <%= f.submit 'Sign up', class:'btn btn-primary btn-block' %> 

      <% end %>

  </div>
</div>
</body>
</html>

这是用facebook按钮登录的：

<div><i class="icon-heart"></i></div>
    <%= f.submit 'Sign in', class:'btn btn-primary btn-block' %> 
    <%= link_to "Sign in with facebook", user_omniauth_authorize_path(:facebook), class:'btn btn-primary btn-block' %>
    <br>
    <div align="center"> 
</div>

非常感谢有关如何显示这些验证错误的任何帮助。谢谢

Answer 1

你可以尝试在验证中添加条件，即在facebook id存在时不验证某些属性（意味着用户从Facebook注册）

validates :first_name, presence: true, if: Proc.new {|u| u.facebookid.nil? }

关于表单中的错误，您可以删除显示所有错误的顶部，并使用

<%= user.errors[:first_name] %>

靠近你的领域。您可以通过执行

始终访问属性（表单字段）错误

object.errors[:attributename]

Answer 2

我们之前已经实现了这一目标：http://firststopcosmeticshop.co.uk（点击＆＃34;注册＆＃34;）

我们这样做的方式实际上非常简单：

<强>错误

您将从模型中显示的每个错误都必须在@object.errors哈希值中定义。

您实际上无需在页面顶部显示错误，而是能够手动循环播放散列，并显示错误和错误。将它们显示在行：

表格中

#app/views/devise/registrations/new.html.erb
<%= form_for ........ do |f| %>
   <%= f.email_field :email %>
   <%= devise_resource.errors[:email].first if devise_resource.errors[:email].present? %>
   <%= f.submit %>
<% end %>

显然是一个非常简化的示例，但正如您所看到的，如果它存在，您将能够与输入内联显示错误。此代码有些陈旧（可能不再是devise_resource） - 无论哪种方式，我们发现最好的方法是只显示您喜欢的错误

Answer 3

如果您使用Simple Form gem，则可以使用simple_form_for代替form_for。 simple_form_for会自动显示内联错误消息。

宝石read me here。

如果您想显示完整的错误消息，请点击此链接Display inline errors with simple_form in a Bootstrap Ajax modal。希望这能帮到你！

如何在内联而不是在页面顶部显示验证错误

3 个答案: