8

我有一个列出项目的页面。在每个项目下方，它列出了该项目的所有评论（评论是项目下的嵌套资源）。

您可以在项目页面上在线添加新评论。当您这样做时，它正在重新加载整个页面，因此我想将其更改为使用 Ajax 并仅使用 jQuery 插入评论。

所以我改变了我的评论/_form.html.erb 使用 :remote=>true

<%= form_for([@item,@comment], :remote=>true) do |f| %>

我在 comments_controller 中添加了 format.js：

def create
  @comment = Comment.new(params[:comment])
  @comment.save

  respond_to do |format|
    format.js
    format.html { redirect_to items_path}
  end
end

并创建了一个简单的 comments/create.js.erb 来将新的评论插入页面：

$("#comments").append("<%= j(render(@comment)) %>");

但是，当我提交评论时（即使在表单上使用 :remote=>true），它也会不断重新加载整个页面/忽略我的 .js 文件。

所以我从 respond_to 中删除了 format.html（因为我不想使用那个选项），但是它给了我错误Completed 406 Not Acceptable in 4ms (ActiveRecord: 0.2ms)

我怎样才能让它留在当前页面上并用我的 create.js 响应？

4

3 回答 3

4

我刚刚发现了问题：

我正在使用 javascript: 提交我的评论表单this.form.submit()。当我不使用:remote=>true. 但是由于某种原因，当我制作表格时会中断:remote=>true。

如果我使用实际的提交按钮，我的问题中的代码可以正常工作。

或者，如果我将 JavaScript 从this.form.submit()使用 jQuery 更改为通过 id 选择表单并提交，那也可以：

$("#new_comment_<%= @item.id %>").submit();
于 2013-01-03T22:00:03.387 回答
3

我在 2020 年尝试使用 Rails 6 找出类似的东西时遇到了这个问题。

我有一个使用. 默认情况下创建的表单，form_with我使用. 这不起作用，但使用按钮代替工作，就像在原始问题中一样。remote: truesubmit()HTMLFormElement<input type="submit">

这背后的原因是submit()在 JavaScript 中调用不会触发onsubmit表单上的事件，而单击<input type="submit">按钮会触发此事件（MDN 文档）。Rails 的处理remote: true取决于此事件被触发，因此行为中断。

我使用此答案中的解决方法在 JavaScript 中提交我的表单，并且该remote: true行为现在按预期工作。

此外，如果您正在使用rails-ujs，则可以使用此包装器提交表单（source）：

form = document.querySelector('form');
Rails.fire(form, 'submit');

我希望这对其他人有帮助！

于 2020-03-14T20:45:36.323 回答
2

您应该添加:format => :js到您的 form_for

并可能更新，

format.js { render :nothing => true }
于 2013-01-03T21:22:09.563 回答