AJAX删除工作但不重新加载页面

时间:2014-09-01 05:26:52

标签: javascript ruby-on-rails ajax destroy

我确定我在这里遗漏了一些东西但是尽管我所有的搜索都无法弄明白。 Pit正在根据我的日志删除,但页面上没有任何反应。我必须手动刷新页面才能显示更改。我刚才在我的应用程序中使用JS,所以这是我第一次使用它。感谢。

我的日志说明了这个

Started DELETE "/pits/25" for 127.0.0.1 at 2014-09-01 00:20:45 -0500
Processing by PitsController#destroy as JS
  Parameters: {"id"=>"25"}
  User Load (0.4ms)  SELECT  "users".* FROM "users"  WHERE "users"."id" = 1  ORDER BY "users"."id" ASC LIMIT 1
  Pit Load (0.3ms)  SELECT  "pits".* FROM "pits"  WHERE "pits"."user_id" = ? AND "pits"."id" = 25 LIMIT 1  [["user_id", 1]]
   (0.1ms)  begin transaction
  ActsAsVotable::Vote Load (0.1ms)  SELECT "votes".* FROM "votes"  WHERE "votes"."votable_id" = ? AND "votes"."votable_type" = ?  [["votable_id", 25], ["votable_type", "Pit"]]
  SQL (28.1ms)  DELETE FROM "pits" WHERE "pits"."id" = ?  [["id", 25]]
   (1.3ms)  commit transaction
  Rendered pits/destroy.js.erb (0.6ms)
Completed 200 OK in 111ms (Views: 37.7ms | ActiveRecord: 30.2ms)

索引视图

<div class = "container list-pits"> 
  <%= link_to "Add New Pit", new_pit_path, class: "btn btn-default" %>
  <br>
  <br>
  <% @pit.each do |pit| %>



   <div class = "container">
    <div class = "well pit-index"> 
       <h3 id="pit-title"><%= link_to pit.topic, pit_path(pit) %></h3>
       <p>by <%= link_to pit.author, '#' %></p>
          <br>
            <p><%= pit.summary %></p>
            <p>Replies (<%= pit.comments.count %>)</p>
          <br>

            <p>Pit Created by: <%= link_to pit.user.name, pit.user %> on <%= pit.created_at %></p>

            <%= link_to "View Pit", pit_path(pit), class: "btn btn-primary" %>


                 <%= link_to pit_path(pit), remote: true, method: :delete, data: { confirm: 'Are you sure?' } do %>
                    <button class = "btn btn-primary">Delete!</button>
                    <% end %>




      </div>
    </div>
      <% end %>


 </div>

控制器操作

def destroy
  @pit.destroy
end

destroy.js.erb

$('.pits').html("<%= j (render @pits);

1 个答案:

答案 0 :(得分:1)

这是一个开始:

#app/views/pits/destroy.js.erb
$('.pits').html("<%= j (render @pits) %>");

<强> JS

你提到你是RoR / Ajax的新手 - 让我给你一些如何完成这项工作的细节

首先,您似乎可以根据需要发送ajax请求。问题在于您如何捕获您创建的响应。我会在一分钟内解释ajax,但最后让我向您介绍如何处理响应

每次发送ajax请求时,您都会从服务器收到response。作为开发人员,您的工作就是确保在您的应用程序中处理响应

你必须记住 ajax总是发送回复 - 你如何处理它取决于你

-

在Rails中,您可以使用两种类型的Ajax响应:

  
      
  1. &#34;标准&#34; Ajax响应捕获
  2.   
  3. 基于Rails的响应(使用views系统)
  4.   

这两种方法相同(我在下面详述),它们与 的工作方式不同。

&#34;标准&#34; ajax响应允许你捕获&amp;操纵ajax调用本身的响应:

$.ajax({
  ...
  success: function(data) {
     ...
  }

这使你能够操纵&#34;裸体&#34;来自服务器的反馈,是Ajax最常见的用法。这个系统的缺点是你只能 能够使用你通过ajax响应获得的数据(除非在Ajax响应中定义,IE没有Rails数据可用)

使用Ajax的另一种方式是&#34; Rails&#34;方式(我不确定具体的术语)。它基本上允许您在后台创建功能,Rails服务器将在views目录下呈现,允许您使用特定于Rails的方法:

#app/controllers/pits_controller.rb
class PitsController < ApplicationController
  respond_to :js, :html, only: :destroy

  def destroy
     @pit = Pit.find params[:id]
     @pit.destroy

     respond_with @pit
  end
end

#app/views/pits/destroy.js.erb
// you can use @pit here
$('.pits').html("<%= j (render @pits) %>");

<强>的Ajax

为您简要解释一下Ajax - 它基本上是一种发送&#34;伪请求的方法。通过浏览器到后端服务器:

enter image description here

为了让您对此有所了解,您必须明白HTTP protocol is stateless,这意味着您发送的每个请求都是&#34; new&#34;到服务器。当您发送ajax请求时,它只是使用Javascript向服务器发起新请求,该请求将向其发送响应

您收到的回复取决于您的后端编码,但基本上可以让您发送&amp;从传统的HTTP请求范围接收数据。最重要的是,ajax请求与标准请求相同,除非它是由Javascript提供的