对使用哪个 Prototype 助手感到困惑答案

【问题标题】：Confused as to which Prototype helper to use对使用哪个 Prototype 助手感到困惑
【发布时间】：2011-01-24 18:26:05
【问题描述】：

阅读http://api.rubyonrails.org/classes/ActionView/Helpers/PrototypeHelper.html 后，我似乎无法找到我想要的东西。我有一个简单的模型，在消息列表达到 24 条后删除最旧的消息，模型就是这么简单：

class Message < ActiveRecord::Base
  after_create :destroy_old_messages
  protected
  def destroy_old_messages
    messages = Message.all(:order => 'updated_at DESC')
    messages[24..-1].each {|p| p.destroy } if messages.size >= 24
  end
end

消息列表下方有一个消息表单，用于添加新消息。我正在使用 Prototype/RJS 将新消息添加到列表顶部。创建.rjs：

page.insert_html :top, :messages, :partial => @message
page[@message].visual_effect :grow
#page[dom_id(@messages)].replace :partial => @message
page[:message_form].reset

我的 index.html.erb 很简单：

<div id="messages">
  <%= render :partial => @messages %>
</div>
<%= render :partial => "message_form" %>

添加新消息后，它们看起来还不错，但当达到 24 条消息限制时，它只会继续添加消息，不会删除旧消息。理想情况下，我希望它们随着新的添加而淡出，但它们可能会消失。 create.rjs 中的注释行实际上有效，它删除了过期的消息，但在添加新消息时我失去了视觉效果。有没有人建议如何从这个简单的列表中添加和删除消息，并对两者都有影响？帮助将不胜感激。谢谢阅读。 P.S.：periodic_call_remote 在这种情况下会有所帮助吗？

【问题讨论】：

是消息没有从数据库中删除，还是在 AJAX 请求期间消息没有从 DOM 中删除的问题？
它们正在从数据库中删除，我只是无法让它们随着新消息的添加而消失。我希望一次只显示 24 条消息。因此，当使用 ajax 添加一条消息时，底部最旧的消息也应该使用 ajax 删除。我一直在查看的来源是 wiki.rubyonrails.org/howtos/rjs-templates> 和我在 google 上喜欢的 rjs 备忘单 pdf。他们并没有完全有帮助。顺便说一句，感谢您的快速响应。

标签： ruby-on-rails ruby ajax prototypejs rjs

【解决方案1】：

我将假设您的 message 部分在渲染后看起来像这样：

<div id='message_123'>
  <h3>Message Header</h3>
  <p>This is the body of the message</h3>
</div>

如果不是这种情况，请更改它。每条消息都应该包含在div 或span 中，其中包含该消息的ID。然后您可以将以下方法添加到您的Message 模型中：

def old_messages
  messages = Message.all(:order => 'updated_at DESC')
  if messages.size >= 24
    return messages[24..-1]
  else
    return []
  end
end

然后，在响应此请求的操作中，只需添加以下行：

@old_messages = Message.old_messages

并将您的 RJS 更改为：

page.insert_html :top, :messages, :partial => @message
page[@message].visual_effect :grow
#page[dom_id(@messages)].replace :partial => @message
page[:message_form].reset
@old_messages.each do |m|
  page.remove(m.id)
end

您可以看到我正在使用 rails remove 方法来完成将不需要的消息从 DOM 中取出的操作。

【讨论】：

这是正确的方法：需要显式淡出或移除已删除消息的 DOM 元素。不过，答案中有几个错别字。 messages.zie 在第一个 Ruby 块中应该是 messages.size。在 RJS 中有一个}，其中| 应该是关闭@old_messages.each 的块参数列表。
感谢史蒂夫指出这些缺陷。我写的时候一定很累。

【解决方案2】：

也许这些步骤会有所帮助。

将“已删除消息”作为 AR 哈希数组或仅返回 ID
在 HTML 元素的 ID 中为每条带有 AR 对象 ID 的消息渲染 HTML 元素
使用 ID 标识表单上的 HTML 元素并替换为空白 HTML 元素

你有一个可行的解决方案。我希望这会有所帮助。

【讨论】：