ruby-on-rails - 在 Rails 中通过 ajax 渲染 Ancestry 嵌套评论的回复表单

Question

我使用祖先 gem 嵌套了评论。 我面临的挑战是如何使用 ajax/jquery 在同一页面上适当的评论下方呈现回复表单，而不重定向到"new"页面以输入回复。这些评论链接到另一个称为记分板的模型。到目前为止我所做的相应代码文件如下:

计分板#显示带有表单区域的页面:

<div class= "comment-section">

  <%= form_for [@scoreboard, @comment], :html => { :id => "new-comment-entry" } do |f| %> 

       <%= render 'shared/error_messages', object: f.object %>
       <%= f.text_area :body, class: "comment-field" %>
       <%= f.hidden_field :parent_id %>
       <%= f.submit "Join the discussion...",:data => {:disable_with => "Uploading Comment..."}, class: " comment-button btn btn-primary" %>
  <% end %>

  <%= nested_comments @scoreboard.comments.arrange(:order => :created_at) %>
 </div>

_comment.html.erb

<div class=" comment-div"> 
 <p> Posted by <%= link_to "#{comment.user.name}", comment.user %>
   <%= time_ago_in_words(comment.created_at) %> ago
 </p>
 <div class="comment-body" id="comment-<%= comment.id %>">
  <%= comment.body %>
  <%= link_to "Reply", new_scoreboard_comment_path(@scoreboard, comment, parent_id: comment.id), remote: true %> |
  <%= link_to "Delete", scoreboard_comment_path(@scoreboard, comment), :data => {:confirm => 'Delete Message?'}, method: :delete %>
 </div>
</div>

注释 Controller 新建和创建方法

def new
 @scoreboard = Scoreboard.find(params[:scoreboard_id])
 @comment = @scoreboard.comments.new(:parent_id => params[:parent_id])
 respond_to do |format|
     format.js { render action: "new" }
 end
end



def create
     @scoreboard = Scoreboard.find(params[:scoreboard_id])
     @comment = @scoreboard.comments.new comment_params
     respond_to do |format|
      if @comment.save
        format.html { redirect_to scoreboard_url(@comment.scoreboard_id) }
      else
       format.html  { 
        redirect_to scoreboard_url(@comment.scoreboard_id)
        flash[:success] = 'Comment must be less than 140 characters'
       }
      end
     end
end

new.js.erb

$("#comment-<%<a href="https://stackoverflow.com/cdn-cgi/l/email-protection" class="__cf_email__" data-cfemail="162b5675797b7b73786238667764737862" rel="noreferrer noopener nofollow">[email protected]</a>_id %>").after("<%= j render "reply_form");

_reply_form.html.erb

<%= form_for [@scoreboard, @comment] do |f| %> 
        <%= render 'shared/error_messages', object: f.object %>
        <%= f.text_area :body, class: "comment-field" %>
        <%= f.hidden_field :parent_id %>   
        <%= f.submit "Reply", class: " comment-button btn btn-primary" %>               
<% end %>

这只是我对它应该如何发生的看法，显然我做错了什么，因为在开发中我收到以下错误:

Completed 406 Not Acceptable in 114ms

ActionController::UnknownFormat (ActionController::UnknownFormat):
  app/controllers/comments_controller.rb:6:in `new'

如果可能的话，我愿意接受不同的方法。提前致谢。

编辑: 包括nested_comments 辅助方法(如果它可能导致问题):

def nested_comments(comments) 
  comments.map do |comment, sub_comment|
    render(comment) + content_tag(:div, nested_comments(sub_comment), class:  "nested_messages")
  end.join.html_safe
end

Answer 1

我认为问题出在这一行:

<%= link_to "Reply", new_scoreboard_comment_path(@scoreboard, comment, parent_id: comment.id), remote: true %>

更改为

<%= link_to "Reply", new_scoreboard_comment_path(@scoreboard, comment, parent_id: comment.id, js: true), remote: true %>

此外，我认为您的 new.js.erb 有语法错误。应该是:

$("#comment-<%<a href="https://stackoverflow.com/cdn-cgi/l/email-protection" class="__cf_email__" data-cfemail="5e631e3d3133333b302a702e3f2c3b302a" rel="noreferrer noopener nofollow">[email protected]</a>_id %>").after("<%= j render('reply_form', scoreboard: @scoreboard, comment: @comment %>");

将reply_form的第一行更改为:

<%= form_for [scoreboard, comment] do |f| %>