2016-07-14 39 views
0

我有一个模式的形式,看起来像这样:与远程一个内嵌的form_for错误信息:真正

<%= form_for (@change_office_address_), remote: true, format: :json, html: { class: :contact_form } do |f| %> 
      <div id="error_explanation" style='display:none;' class="bg-danger text-danger alert fade in alert-danger alert-dismissable errors"> 
      <ul> 
       <% if @change_office_address_.errors.any? %> 
       <% @change_office_address_.errors.full_messages.each do |msg| %> 
        <li><%= msg %></li> 
       <% end %> 
       <% end %> 
      </ul> 
      </div> 
      <%= f.hidden_field :city_id, value: @office.city.id %> 
      <%= f.hidden_field :office_id, value: @office.id %> 
      <%= f.hidden_field :insurer_id, value: @office.insurer.id %> 
      <%= f.text_field :name, placeholder: 'Name', class: 'form-control' %> 

      <br> 
      <%= f.text_field :email, placeholder: 'e-mail', class: 'form-control' %> <br> 
      <%= f.label :city_name, 'City' %> 
      <%= f.text_field :city_name, class: 'form-control', value: @office.city.name.mb_chars.titleize, readonly: true %> 
      <br> 
      <%= f.label :insurer_name, 'Insurer' %> 
      <%= f.text_field :insurer_name, class: 'form-control', value: @office.insurer.short_name, readonly: true %> 
      <br> 
      <%= f.label :office_name, 'Insurer\'s office address' %> 
      <%= f.text_field :office_name, class: 'form-control', value: @office.address, readonly: true %> 
      <br> 
      <%= f.text_field :edit_office_address, placeholder: 'New address', class: 'form-control' %> <br> 
      <%= f.text_area :comment, placeholder: 'Comment', class: 'form-control', cols: '30', rows: '5' %> <br> 
      <div class="text-center"> 

      <%= f.submit 'Inform about deleting', class: 'btn btn-danger' %> 
      <%= f.submit 'Inform about changing address', class: 'btn btn-default' %> 
      </div> 
     <% end %> 

提交表单后,和验证未通过,我可以看到错误信息在我的表单顶部。但我想在内联中显示错误。我试图将<span class="help-inline"><%= @change_office_address_.errors[:email] %></span>添加到我的表单中,但它不起作用。

控制器:

class ChangeOfficeAddressesController < ApplicationController 
    def create 
    @change_office_address = ChangeOfficeAddress.new(change_office_addresses_params) 
    respond_to do |format| 
     if params[:commit] == 'Inform about changing address' 
     if @change_office_address.save 
      format.html { ChangeOfficeAddressMailer.change_office_address_new(@change_office_addres).deliver_now 
         redirect_to :back, notice: 'Thanks.' } 
      format.json { redirect_to :back, status: :created, location: @change_office_address, 
            notice: Thanks.' } 
     else 
      format.json { render json: @change_office_address.errors.full_messages, status: :unprocessable_entity } 
     end 
     elsif params[:commit] == 'Inform about changing address' 
     @change_office_address.delete_office_address = 'Some text' 
     @change_office_address.edit_office_address = nil 
     if @change_office_address.save 
      format.html { ChangeOfficeAddressMailer.change_office_address_new(@change_office_addres).deliver_now 
         redirect_to :back, notice: 'Thanks.' } 
      format.json { redirect_to :back, status: :created, location: @change_office_address, 
            notice: 'Thanks.' } 
     else 
      format.json { render json: @change_office_address.errors.full_messages, status: :unprocessable_entity } 
     end 
     else 
     if @change_office_address.save 
      format.html { ChangeOfficeAddressMailer.change_office_address_new(@change_office_addres).deliver_now 
         redirect_to :back, notice: 'Thanks.' } 
      format.json { redirect_to :back, status: :created, location: @change_office_address, 
            notice: 'Thanks.' } 
     else 
      format.json { render json: @change_office_address.errors.full_messages, status: :unprocessable_entity } 
     end 
     end 
    end 
    end 

    private 

    def change_office_addresses_params 
    params.require(:change_office_address).permit(:email, :name, :edit_office_address, :add_office_address, 
                :delete_office_address, :office_id, :insurer_id, :city_id, :comment) 
    end 

end 

而且application.js中:

$(document).ready(function() { 
    return $(document).bind("ajaxError", "form.contact_form", function(event, jqxhr) { 
    var $contact_form, $error_container, $error_container_ul; 
    $contact_form = $(event.data); 
    $error_container = $("#error_explanation", $contact_form); 
    $error_container_ul = $("ul", $error_container).empty(); 
    if ($error_container.is(":hidden")) { 
     $error_container.show(); 
    } else { 
     $("#error_explanation").remove("#error_explanation"); 
    } 
    return $.each(jqxhr.responseJSON, function(index, message) { 
     return $("<li>").html(message).appendTo($error_container_ul); 
    }); 
    }); 
}); 

有什么办法来增加这些错误消息?谢谢。

回答

1

要获得内联验证,我会使用Jquery验证并在您的change_office_address模型上进行验证。

当我不得不做类似的东西我用这个SO张贴作为参考,这是我套用后:

How to use jquery validation plugin in rails

首先包括在布局jQuery的验证文件,该文件可以在这里找到:

https://jqueryvalidation.org/

然后在您的形式添加一个类所需要的领域,如<%= f.text_field :firstname, :class => "required" %>。然后用form_id编写一个方法来触发验证。

function validateofficeFuction() { 
    $("#change_office_form").validate({ 
     errorClass: "authError" 
    }) 
} 

$(document).ready(validateofficeFuction); 
$(document).on('page:load', validateofficeFuction); 

如果您使用turbolinks 5,它包括在轨5,而不是使用$(文件)。就绪使用的$(document)。在 “turbolinks:负荷”

如果设置在正确的情况下,您应该在每个失败的字段下方显示错误消息,而不是位于页面或表单顶部。