在Rails中使用Ajax删除记录

我有一个用户页面,用户可以在其中输入和提交帖子.我正在使用Ajax允许用户从用户/显示页面执行此操作.当我试图让用户删除帖子时,我遇到了这个问题.当用户点击"删除"链接时,该帖子将从页面中删除.但是,当我重新加载页面时,帖子又回来了.它没有被摧毁.

我在不同的上下文中的用户/编辑页面上实现了相同的代码,并且工作正常,因为在提交表单时销毁了帖子记录.但是,在没有提交表单的情况下,我不确定如何使用它.

这是我的设置:

:user has_many :posts
:post belongs_to :user
:post belongs_to :post_type
:post_type has_many :posts

用户#show:
这是用户提交帖子的代码.这非常有效.

<% if logged_in? && current_user == @user %>
  <% form_tag(:controller => "posts", :action => "create") do %>
    
<%= text_area_tag(:message, nil, :size => "27x3") %>
    
<%= submit_tag("Post") %>
    
<%= label_tag(:post_type_id, "Update type?", :class => 'typeLabel') %>
    
<%= collection_select(@posts, :post_type_id, PostType.all, :id, :name) %>
  <% end %>
<% end %>

这是显示帖子的代码,包括有争议的"删除链接":

<% @user.posts.each do |c| %>
  

    
<%=h c.message %>
    
<%=h c.post_type.name %>
    
Posted <%=h time_ago_in_words(c.created_at) %> ago
       
    <% if logged_in? && current_user == @user %>
        <%= link_to_function "- Delete Post", "if(confirm('Are you sure you want to permanently delete this post?')) $(this).up('.postS').remove()" %>                          
    <% end %>                   
<%end%>

def destroy
  @post = Post.find(params[:id])
  if @post.destroy
    redirect_to :back
  else
    flash[:notice] = "Post failed to delete."
    redirect_to :back
end
end

如果有任何其他信息有用,请告诉我.谢谢!

更新2

我试着link_to_remote按照下面的答案解释.我同意这是正确的解决方案,但无法使其正常运行.我认为这是因为路线问题.

我将帖子设置为这样的用户资源:

map.resources :users, :member => { :enable => :put } do |users|
  users.resources :posts
end  

当我实现link_to_remote答案中提供的代码时,我得到一个"无方法错误"异常,如下所示:undefined methodpost_url'for#`

我尝试了一些调整,但我没有尝试过.有任何想法吗？我是对的,这与我的路线有关吗？

UPDATE

Rails指南中的代码无效.我也尝试了很多变化.

我得到的最接近的是:

<%= link_to_remote "- Delete Post", :url => { :controller => 'posts', :action => 'destroy', :id => @user.posts, :method => :delete }, :confirm => "Are you sure you want to permanetly delete this post?", :success => "$(this).up('.postS').remove();" %>  

使用此代码,我单击删除链接,系统提示我接受删除.我接受后,帖子不会在屏幕上删除.但是,它会从数据库中删除.然后,当我重新加载页面时,帖子实际上已从屏幕上删除.所以这主要是有效的,除了ajax删除操作现在不起作用.

但代码似乎错了.请注意,我写了:: id => @ user.posts

这对我来说似乎不对,但这是我让这段代码完全可行的唯一方法.看看
它对日志文件的作用:处理PostsController#destroy(对于127.0.0.1 at 2009-12-17 02:07:05)[POST]

`Parameters: {"action"=>"destroy", "authenticity_token"=>"GZfPHUc2+qPa6Fj5jNogMyhuB4YUO+KlOdkwjM5NSvw=", "id"=>"12/11", "method"=>"delete", "controller"=>"posts"}  `

注意id =>"12/11".这不是我想要发生的事情.

当我将id参数更改为:id => @ user.post时,我得到"无方法错误".#User:0x3ddc20c的未定义方法`post'

当我尝试时:id => user_post_url(@user, @post),我得到:"user_post_url无法生成[然后它列出了该用户的所有数据库列值].

当我尝试时:id => user_posts_url(@user, @posts),页面加载.当我点击删除链接时,我被提示接受.然后什么都没发生 当我重新加载页面时,帖子仍然存在,并且从未从数据库中删除.

这是我能想到的每一个变化.有任何想法吗？

更新3

这就是我的路线:

    user_posts GET    /users/:user_id/posts(.:format)          {:controller=>"posts", :action=>"index"}
               POST   /users/:user_id/posts(.:format)          {:controller=>"posts", :action=>"create"}
 new_user_post GET    /users/:user_id/posts/new(.:format)      {:controller=>"posts", :action=>"new"}
edit_user_post GET    /users/:user_id/posts/:id/edit(.:format) {:controller=>"posts", :action=>"edit"}
     user_post GET    /users/:user_id/posts/:id(.:format)      {:controller=>"posts", :action=>"show"}
               PUT    /users/:user_id/posts/:id(.:format)      {:controller=>"posts", :action=>"update"}
               DELETE /users/:user_id/posts/:id(.:format)      {:controller=>"posts", :action=>"destroy"}

更新4

根据以下ScottD的指导,我的代码现在看起来像这样:

<%= link_to_remote "- Delete Post", :url => user_post_url(@user,c), :method => :delete, :confirm => "Are you sure you want to permanently delete this post?", :success => "$(this).up('.postS').remove();" %>  

这解决了我的大多数问题,但javascript删除操作仍然没有被触发.换句话说,我点击删除链接.帖子将从数据库中删除,但仍保留在屏幕上.当我重新加载页面时,帖子就消失了.所以,问题是以下部分没有被触发:: success =>"$(this).up('.postS').remove();"

以下是我点击删除链接时日志中发生的情况,如上所述:

Processing PostsController#destroy (for 127.0.0.1 at 2009-12-17 11:59:18) [DELETE]  
  Parameters: {"action"=>"destroy", "authenticity_token"=>"ccF1QNCGs9IlvbIYWwmQmcbi7kROgQsTZjM1dM687xA=", "_method"=>"delete", "id"=>"14", "controller"=>"posts", "user_id"=>"1"}  
  User Columns (3.2ms)   SHOW FIELDS FROM `users`
  User Load (29.6ms)   SELECT * FROM `users` WHERE (`users`.`id` = 1) ORDER BY name
  Post Columns (8.7ms)   SHOW FIELDS FROM `posts`
  Post Load (1.6ms)   SELECT * FROM `posts` WHERE (`posts`.`id` = 14) 
    app/controllers/posts_controller.rb:22:in `destroy'
  SQL (0.1ms)   BEGIN
    app/controllers/posts_controller.rb:23:in `destroy'
  Post Destroy (0.5ms)   DELETE FROM `posts` WHERE `id` = 14
    app/controllers/posts_controller.rb:23:in `destroy'
  SQL (0.9ms)   COMMIT
    app/controllers/posts_controller.rb:23:in `destroy'
Redirected to http://localhost:3000/users/1
Completed in 65ms (DB: 45) | 302 Found [http://localhost/users/1/posts/14]  

对我来说,这一切看起来都不错.所以我不确定为什么javascript删除不起作用.

当我重新加载页面时,日志显示正常加载的所有内容并且帖子已经消失(应该是这样).关于如何让javascript删除工作的任何想法？

更新#5

以下是基于link_to_remote我正在使用的代码在html中生成的内容:

- Delete Post  

当我单击页面上的"删除"文本时,Firebug在控制台中显示的内容如下:

POST http://localhost:3000/users/1/posts/18  302 Moved Temporarily  
GET  http://localhost:3000/users/1 200 OK

scottd.. 6

问题是您使用的link_to_function只调用Javascript函数,它不会向您的应用发送任何内容.如果你想做Ajax试试link_to_remote.这将进行AJAX调用,然后它允许您基于回调挂钩调用javascript,如:success或:complete.

基于您的示例的示例:

<% if logged_in? && current_user == @user %>
  <%= link_to_remote "- Delete Post", :url => user_post_url(@user,c, :format => :json), :method => :delete  , :confirm => "Are you sure you want to permanetly delete this post?", :success => "$(this).up('.postS').remove();" %>                                                      
<% end %> 

有关更多示例,请查看Rails API文档link_to_remote.

您还需要更新Post Controller以响应来自Ajax的删除请求.我使用新的json gem来渲染json.

def destroy
  @post = Post.find(params[:id])
  respond_to do |format|
    if @post.destroy
      format.html { redirect_to :back }
      format.json { :success => true }.as_json
    else
      flash[:notice] = "Post failed to delete."
      format.html { redirect_to :back }
      format.json { :success => false }.as_json
    end
  end
end

更新以反映有问题的嵌套路由.

问题是您使用的link_to_function只调用Javascript函数,它不会向您的应用发送任何内容.如果你想做Ajax试试link_to_remote.这将进行AJAX调用,然后它允许您基于回调挂钩调用javascript,如:success或:complete.

基于您的示例的示例:

<% if logged_in? && current_user == @user %>
  <%= link_to_remote "- Delete Post", :url => user_post_url(@user,c, :format => :json), :method => :delete  , :confirm => "Are you sure you want to permanetly delete this post?", :success => "$(this).up('.postS').remove();" %>                                                      
<% end %> 

有关更多示例,请查看Rails API文档link_to_remote.

您还需要更新Post Controller以响应来自Ajax的删除请求.我使用新的json gem来渲染json.

def destroy
  @post = Post.find(params[:id])
  respond_to do |format|
    if @post.destroy
      format.html { redirect_to :back }
      format.json { :success => true }.as_json
    else
      flash[:notice] = "Post failed to delete."
      format.html { redirect_to :back }
      format.json { :success => false }.as_json
    end
  end
end

更新以反映有问题的嵌套路由.