在 Rails 中使用 AJAX link_to渲染部分

Rendering partial with AJAX link_to in Rails

本文关键字：to 染部 link AJAX Rails      更新时间：2023-09-26

完成 Hartl 的教程后，我正在尝试为 Micropost 模型实现@replies。

我希望微帖子

上的回复按钮在推特上呈现该帖子下方的微帖子表单。我还想将上述帖子的 ：micropost_id 传递给回复，以便我以后可以参考它是回复的帖子，再次是 la twitter。

我一直在尝试根据这个问题的答案来实现其中的一些。

我的微帖子控制器有

def reply_form
    respond_to do |format|
      format.js
    end
  end

视图中的链接是

<%= link_to 'reply', 'shared/reply_form', remote: true, locals: { object: :id } %>

我在那里尝试传递微帖子：id

在一篇文章之后，我有这个部分要呈现在：

<div id="ReplyContainer"></div>

然后我有_reply_form.js.erb

$('#ReplyContainer').html('<%=j render partial: 'shared/reply_form', locals: { object: :id } %>')

它不会引发错误，但单击"回复"链接没有任何效果，也不会使 _reply_form.html.erb 部分化。

我的最终目标是你点击回复，呈现微帖子表单，@username在消息的开头（派生自micropost_id？）提交该表单，然后将新的微帖子保存，包括原始帖子的微post_id我在微帖子表中创建的reply_to列。任何朝着正确方向的推动都非常感谢。不想在完全错误的树上吠叫。谢谢。

编辑：单击回复链接时，我目前遇到路由错误。

(No route matches [GET] "/shared/reply_form")

但据我所知，一切都在正确的地方。

好的，对不起，我刚刚更好地阅读了您的问题，问题与错误的结构有关。

  • 您有一个控制器，其操作将呈现帖子
  • 您的帖子页面将由"帖子"和许多回复组成
  • 我猜每个回复都由部分（假设一个_reply.html.erb文件）组成。

然后，页面的结构将如下所示：

<div>
 ... my post here...
</div>
<div id='repliesContainer'>
<%- @replies..each do |id| -%>
    <%= render :partial => "shared/reply", :locals => { :object => id} %>
<%- end -%>
</div>

我们称之为post.html.erb.

这将是您的shared/_reply.html.erb文件：

  // note here that the id of the div contains the ID of the reply: each ID must be unique in the page....
  <div id='ReplyContainer-#{object}'>
    ...reply content here...
  </div>

现在，您的post.js.erb文件包含以下内容：

$('#repliesContainer').append("<%= escape_javascript( render :partial => 'shared/reply', :locals => { :object => id}) -%>");

append()函数的内容将在服务器上呈现为来自部分的字符串。

你在这里有几个问题：

  1. 正如您发现的那样，回复表单的路由不正确。在修复此问题之前，您将无法调试系统的其余部分。运行 rake routes | grep reply_form 以查找它的 URL（它很可能不在/shared 下），然后查看该 URL 的响应是什么。我敢打赌它会抛出一个错误（参见#2）。

  2. 您的回复表单文件的名称错误：_reply_form.js.erb是部分，但它需要为"reply_form.js.erb"。如果为该控制器找到正确的路由，则会收到"缺少模板"错误，因为它正在寻找普通模板，而不是部分模板。

  3. 最后，reply_form.js.erb代码需要指向共享reply_form部分，因此如果真的在shared/_reply_form.html.erb那么 JS 响应应该正确呈现。

话虽如此...我真的很不喜欢将 Javascript 发送回浏览器，部分原因是它使调试 JS 变得更加困难 - 您将如何在浏览器调试器中找到返回的代码？这种类型的设计可能有一些用例，但它们可能非常罕见。

更好/更传统的解决方案是将 JSON 数据（例如渲染的文本）发送回浏览器，并让一些处理程序解析 JSON 并更新 DOM。这样，您的所有JS代码都存在于浏览器中，并且您接收的只是数据。这将更容易调试。

相关文章：