Rails form with remote: true 重新加载页面答案

【问题标题】：Rails form with remote: true reloads the pageRails form with remote: true 重新加载页面
【发布时间】：2018-02-26 11:08:45
【问题描述】：

在我的 Rails 5.1 应用程序中，我有 2 个控制器：我使用脚手架工具创建的 home_controller 和 posts_controller，所以我正在做的是在我的 home_controller.rb 的索引视图中呈现部分 _form.html.haml，如下所示：（顺便说一句，我使用的是haml）

.top-space
.row.center-xs
    .col-xs-8.col-md-10
        .row
            .col-sm-3.col-lg-2.col-xs-10.top-space
                %ul.no-bullets.text-left
                    %li=link_to "Explore", "#"
                    %li=link_to "Suggestions", "#"
            .col-sm.col-xs-10
                =render "posts/form"
            #posts

我在表单中添加了remote: true，如下所示：

= form_for @post, remote: true do |f|
 - if @post.errors.any?
 #error_explanation
  %h2= "#{pluralize(@post.errors.count, "error")} prohibited this post from being saved:"
  %ul
    - @post.errors.full_messages.each do |message|
      %li= message
 .mdl-textfield.mdl-js-textfield.full-width
   = f.text_area :body, class:"mdl-textfield__input", row:3
   = f.label :body, "Write something",class:"mdl-textfield__label"
.actions.text-right
= f.submit 'Save',class:"mdl-button mdl-js-button mdl-button--raised mdl-button--colored"

如您所见，它有remote: true，但是当我提交表单时，它会将我带到我的posts_controller 中的显示视图，这是我的posts_controller：

def create
 @post = current_user.posts.new(post_params)
   respond_to do |format|
     if @post.save
      format.html { redirect_to @post}
      format.json { render :show, status: :created, location: @post }
     else
      format.html { render :new }
      format.json { render json: @post.errors, status: :unprocessable_entity }
    end
  end
end

我创建了一个show.js.coffee 来显示在表单下方的<div id="posts"> 中创建的帖子

$('#posts').append('<%= j render @post %>')

基本上，我想要显示在表单下方创建的帖子，而无需重新加载页面或带我在posts_controller 中显示视图。

我做错了什么，我该如何做到这一点？

【问题讨论】：

检查浏览器检查器（在 chrome 中：ctrl+shift+j 或 F12）是否有 JS 错误，可能您的 JS 文件没有加载？
没有错误，所有js文件正在加载中
您的routes.rb 文件中有resources :posts 吗？ jquery-ujs javascript 文件是否已加载？

标签： ruby-on-rails ruby ajax forms

【解决方案1】：

尝试像这样设置您的创建操作：

def create
 @post = current_user.posts.new(post_params)
   respond_to do |format|
     if @post.save
      format.js
      format.html { redirect_to @post}
      format.json { render :show, status: :created, location: @post }
     else
      format.js
      format.html { render :new }
      format.json { render json: @post.errors, status: :unprocessable_entity }
    end
  end
end

我刚刚添加了 format.js

【讨论】：