javascript - Rails 通过 ajax 渲染 View

Question

我有一个新表单，如果未通过验证，我想通过 ajax 渲染它

在我的 Controller 中，我有:

def create
  event = CEvent.new(params[:c_event])

  respond_to do |format|
    if event.save
      format.html { redirect_to admin_c_events_path }
    else
      format.js {redirect_to new_admin_c_event_path(:event => event.as_json, :errors => event.errors )}
    end
  end
end

表单有 :remote => true 参数，当我点击提交按钮时，表单是通过js提交的，但没有任何渲染，当我重新加载页面信息时，我需要渲染正常并重新加载页面再次呈现空的新表单。

我的控制台输出:

Started GET "/admin/c_events/new?errors=%23%3CActiveModel%3A%3AErrors%3A0x007f74780d1d50%3E&event%5Babout%5D=&event%5Bbackground_content_type%5D=&event%5Bbackground_file_name%5D=&event%5Bbackground_file_size%5D=&event%5Bbackground_updated_at%5D=&event%5Bcontact_person_id%5D=11&event%5Bcreated_at%5D=&event%5Bfinish_at%5D=2014-01-13+11%3A19%3A00+UTC&event%5Bid%5D=&event%5Blocation%5D=&event%5Bname%5D=dewqr&event%5Bpress%5D=&event%5Bpress_contact_person_id%5D=11&event%5Bstart_at%5D=2014-01-13+11%3A19%3A00+UTC&event%5Bupdated_at%5D=&event%5Bvideo%5D=" for 127.0.0.1 at 2014-01-13 13:19:43 +0200
Processing by Admin::CEventsController#new as JS
  Parameters: {"errors"=>"#<ActiveModel::Errors:0x007f74780d1d50>", "event"=>{"about"=>"", "background_content_type"=>"", "background_file_name"=>"", "background_file_size"=>"", "background_updated_at"=>"", "contact_person_id"=>"11", "created_at"=>"", "finish_at"=>"2014-01-13 11:19:00 UTC", "id"=>"", "location"=>"", "name"=>"dewqr", "press"=>"", "press_contact_person_id"=>"11", "start_at"=>"2014-01-13 11:19:00 UTC", "updated_at"=>"", "video"=>""}}
  Person Load (1.2ms)  SELECT "people".* FROM "people" WHERE (p_type LIKE '%member%')
  Person Load (0.5ms)  SELECT "people".* FROM "people" WHERE (p_type LIKE '%mentor%')
  Rendered admin/c_events/_select_speakers.html.erb (4.0ms)
  Startup Load (0.4ms)  SELECT "startups".* FROM "startups" 
  Rendered admin/c_events/_select_startups.html.erb (4.6ms)
  Rendered admin/c_events/_schedule_fields.html.erb (13.8ms)
  CACHE (0.0ms)  SELECT "people".* FROM "people" WHERE (p_type LIKE '%member%')
  Rendered admin/c_events/new.html.erb within layouts/admin (116.0ms)
  Rendered layouts/_header.html.erb (3.3ms)
  Rendered admin/_top_bar.html.erb (4.8ms)
  Rendered layouts/_footer.html.erb (0.0ms)
Completed 200 OK in 10216ms (Views: 180.0ms | ActiveRecord: 2.1ms)

有没有一种方法可以在不重新加载页面的情况下呈现 View ？

Answer 1

!不是复制/粘贴现成的代码，但这总是对我有用。

将 remote: true 保留到表单中，使其成为 ajax 请求，并在创建操作时将 format.js 添加为 Controller 中的响应。

应用程序 Controller

  ...
  after_filter :add_flash_to_header
  ...

  def add_flash_to_header
    # only run this in case it's an Ajax request.
    return unless request.xhr?

    # add different flashes to header
    response.headers['X-Flash-Error'] = flash[:error] unless flash[:error].blank?
    response.headers['X-Flash-Warning'] = flash[:warning] unless flash[:warning].blank?
    response.headers['X-Flash-Notice'] = flash[:notice] unless flash[:notice].blank?
    response.headers['X-Flash-Message'] = flash[:message] unless flash[:message].blank?

    # make sure flash does not appear on the next page
    flash.discard
  end
  ...

create.js.erb

<% if @cevent.valid? %>
  $("#new_cevent")[0].reset();
  //something more you might need
<% else %>
  $(document).find(".new_cevent").prepend("<%= j(render 'shared/error_messages', object: @cevent) %>");
<% end %>

views/shared/_error_messages.html.erb

<% if object.errors.any? %>
  <div class="alert alert-danger alert-block">
    <h2><%= pluralize(object.errors.count, "error") %> prohibited this schedule from being saved:</h2>
    <button type="button" class="close" data-dismiss="alert">x</button>
    <ul>
    <% object.errors.full_messages.each do |msg| %>
      <li><%= msg %></li>
    <% end %>
    </ul>
  </div>
<% end %>