ajax rails form_with 提交但仅在页面重新加载后

Question

I've had an existing comment form on a resource show.html.erb that I want to be added to the show page without having to reload the entire page. I understand that with ajax via the 'form_with' form, this should be entirely possible.

My issue is that whilst the form does create a new comment, it only appears after I refresh the page.

I also get the following error.

ArgumentError (too few arguments):

app/controllers/comments_controller.rb:18:in 'format' app/controllers/comments_controller.rb:18:in 'create'

comments_controller

class CommentsController < ApplicationController
  before_action :load_commentable
  before_action :authenticate_user!
  before_action :comment_auth, only:  [:edit, :update, :destroy]

...

  def create
    @comment = @commentable.comments.new(allowed_params)
    @comment.user_id=current_user.id if current_user
    if @comment.save
      format.html { redirect_to @commentable, notice: "Comment added." }
      format.js
    else
      render 'edit'
    end

...

views/comments/create.js.coffee

comment = document.getElementById("comment")
comment.innerHTML = "<%= j render(@comment) %>"

views/comments/_form.html.erb

<%= form_with(model: [@commentable, @comment]) do |f| %>
  <% if @comment.errors.any? %>
    <div class="error_messages">
      <h2>Please correct the following errors.</h2>
      <ul>
      <% @comment.errors.full_messages.each do |msg| %>
        <li><%= msg %></li>
      <% end %>
      </ul>
    </div>
  <% end %>

  <p>
    <strong><%= f.label :name, :class=>'form-label' %></strong><br>
    <%= f.text_field :name, value: current_user.fname, readonly: true, :class=>'form-control' %>
  </p>

  <p>
    <strong><%= f.label :title, :class=>'form-label' %></strong><br>
    <%= f.text_field :title, :class=>'form-control' %>
  </p>

  <p>
    <strong><%= f.label :review, :class=>'form-label' %></strong><br>
    <%= f.text_area :body, :class=>'form-control', rows: 5 %>
  </p>
  <p>
    <%= f.submit :class=>'btn btn-success' %>
  </p>
<% end %>

Answer 1

as you know, form_with it's a remote form, you should not use redirect_to there. Please remove your block

if @comment.save format.html { redirect_to @commentable, notice: "Comment added." } format.js else render 'edit' end

replace it to

if @comment.save @status = "success" end

And you can add a notice message to your views/comments/create.js.erb (it's not .js.coffee) with condition of @status (failed/success).

Hope this helps.

Answer 2

For me, I needed

<%= form_with(model: @message, method: :post, local: true) do |f| %> 

local: true was necessary. All other combos didn't work remote: true, remote: false, local: false