我有一个微博/消息系统,每次提交新的微博或评论/消息时,页面都会刷新以显示它。
由于我已经使用 :remote => true 在我的表单上设置了 ajax,我现在希望在不刷新页面的情况下添加或添加微博。
到目前为止,我有:
class MicropostsController < ApplicationController
def create
if params[:micropost][:user_id].to_i == current_user.id
@comment = Comment.new(:user_id => current_user.id)
respond_to do |format|
if @micropost.save
format.js { render :post_on_wall }
else
format.js { render :form_errors }
end
end
else
如果表单通过了所有验证并且用户在单击发布之前实际上输入了有效的内容,那么“如果@micropost.save”将为真,它将在我命名为“post_on_wall”的文件中执行 js。如果 "@micropost.save" 将执行 "form_errors" 中的代码。
在 form_errors 中,我添加了一个警报,只是为了检查当用户不输入任何内容并点击帖子时微博不会被发布。它工作正常。
在“post_on_wall”文件中,我有这个:
$('.microposts').prepend('<%= j render("users/partials/microposts") %>');
这样做的问题是它基本上抓取了正在呈现“users/partials/ microposts ”的文件中循环的所有微帖子,然后将它们放在“.microposts”div中的所有内容之上。即使是位于“.microposts”顶部的发布微博的实际表单也被推到刚刚添加到页面的内容下方。在这种情况下,当我使用分页并将 per_page 设置为 10 时,向下 10 个空格。
这是我的html结构。
<div class='cf' id='content'>
<div id='leftColumn'>
</div>
<div class='microposts'>
</div>
<div id='rightColumn'>
</div>
</div>
每个微博及其相关评论都存储在一个名为“.postHolder”的类中。
我觉得我的做法是错误的。这个文件:“users/partials/microposts”指向的文件基本上有代码可以帮助一次显示几个微帖子(10)。这用于与我正在尝试做的完全不同的事情(分页+无限滚动)。
无论如何,我觉得我应该处理的方法是如何检测刚刚发布的新帖子。它应该被检测为一个新的“.postHolder”类,然后在找到它之后应该将它添加到“postHolder”列表的顶部,而不是替换它上面的微帖子表单。
我正在考虑创建一个单独的 div 来保存所有微帖子,然后将此 div 放在微帖子表单下方。这样我就不必担心表单被推下,因为它不会在 div 里面包含实际上将是我将要准备的所有微博。
这仍然给我留下了获取刚刚发布的帖子然后将其添加到列表顶部的问题。
无论如何,我真的很想要一个可以帮助我实现此功能的示例或一些好的建议。
感谢您的时间亲切的问候。