Ajax删除不会刷新页面

我试图找出更好的Ajax！我想删除一个没有加载整个页面的ajax请求的行。该行获取删除，但为了检查我必须手动刷新页面。我遇到的问题是，单击删除按钮后，该项目不会被删除，而无需刷新页面。Ajax删除不会刷新页面

继承人我删除按钮：

<% current_user.agreements.each do |agreement| %> 
 
\t <div class="remove-dis"> 
 
\t <div class="requestone" style="border-bottom:solid grey 1px;height:100px;"> 
 

 
\t \t 
 
<div style="float:left;"> 
 
\t <h>Offers</h> 
 
</div> 
 

 
<%= link_to view_scribe_request_path(agreement) do %> 
 
<div class="text-center"> 
 
\t <h><%= agreement.title%></h> 
 
</div> 
 

 
<% end %> 
 

 
<div style="float:left;"> 
 
\t <h>Views</h> 
 
</div> 
 

 
<div class="text-center"> 
 
\t <h><%= agreement.description%></h> 
 
</div> 
 

 
<div> 
 
\t <%= link_to 'delete', agreement_path(agreement), method: :delete, data: { confirm: 'Are you sure?' }, remote: true, :class => 'delete_request' %> 
 
\t \t 
 
\t 
 

 
</div> 
 

 
\t </div> 
 

 
</div> 
 
<% end %>

路线为：

resources :agreements

协议控制器： “持有AJAX删除方法”

def destroy 
     @agreement = Agreement.find(params[:id]) 
     @agreement.destroy 

     respond_to do |format| 
     format.html { redirect_to my_requests_path } 
     format.json { head :no_content } 
     format.js { render :layout => false } 
    end 
    end

我destroy.js.erb：

$('.delete_request').bind('ajax:success', function() { 
 
    $('.remove-dis').fadeOut(); 
 
});

我已经做了一些改动JS和HTML的时候看到我的列表中删除会发生什么。所有列出的项目将被从页面中删除，直到刷新。我怎样才能捕捉到所列的一行？

来源

2016-09-15 Michael Lombardo

发生这种情况的原因是因为您的页面默认使用请求时存在的数据来呈现。它不知道什么时候记录被更新，修改，删除等，没有告诉它信息已经更新。

当您重新加载页面时，您手动通知服务器获取数据库中可用的最新数据，因此为什么在重新加载后看到正确的结果。

当您的服务器通过其AJAX响应确认该项目已被删除时，您将要么使用javascript从DOM中删除该项目，要么使用更多的工作，您可以打开一个实时连接WebSockets会在发生更改时立即通知您的前端。

最有可能的，你是destroy.js.erb没有找到在下面的行定义的元素：

var element = document.getElementById("<%=j @agreement.id %>");

尝试保持您所请求之前删除服务器上的项目的ID的轨道请求已经完成，并且当您确定它已从数据库中删除时，您可以使用JavaScript在DOM中删除它。

来源

2016-09-15 20:42:11

Ajax删除不会刷新页面

回答

相关问题