ajax在后台发生其他事件时调用

时间:2012-10-11 13:51:20

标签: ruby-on-rails jquery ruby-1.8.7

我正在尝试在上传文件并解压缩时显示进度百分比。我使用ruby-zip解压缩文件。解压缩时,我增加计数器并将其存储在数据库中。我有一个像

的表格
<% form_tag '/unzip', :multipart => true do %>
  <%= file_field_tag "zipfile", :size => 12 %> 
  <button class="add_button" type="submit" value="Add"> Add </button>
<% end %>
<div class="progress">
</div>

unzip操作中,所有内容都解压缩并将值存储在数据库中。现在,我想每2秒左右更新一次.progress div。首先,我尝试在单击按钮时进行ajax调用,并调用另一个获得此进度的方法。但我没有成功,因为下面这个简单的代码给了我错误。

<script>
$(".add_button").click(function() {
  $.ajax({
    url: "/get_progress", 
    method: "POST"
  })
})
</script>

在get_progress方法中,我只是从数据库中取出值

def get_progress
  @progress = Progress.last.value
  respond_to do |format|
    format.js
  end
end

出于简单的检查目的,我只是console.log("rendered")中的get_progress.js.erb。但由于之前有错误消息,因此永远不会被调用。但是,我检查了ajax调用正在向get_progress发出请求。

但问题是,我在jquery1.6.3第7948行的xhr.send((s.hasContent && s.data) || null)中收到错误。我想我收到此错误,因为在ajax调用期间此页面被重定向到其他地方并且还有另一个请求在我打电话的时候,因为很明显我在表单提交时会调用另一个动作。

当我通过执行以下操作打印出ajax调用上的错误时:

error:function(xmlHTTPRequest, textStatus, errorThrown){
  console.log(xmlHTTPRequest);
}

我得到了这个:

Object {readyState = 0 ,status = 0 ,statusText = "error" }

我认为我的问题类似于question。但是,这里提出的答案并没有解决我的问题。

有什么方法可以解决这个问题吗?我希望问题很明确!

1 个答案:

答案 0 :(得分:1)

当我将ajax调用从post更改为get时,这似乎对我有用。

查看:

Progress:
<div id="progress">
</div>

<br />

<button class="add_button" type="submit" value="Add"> Add </button>
<script>
$(".add_button").click(function() {
  $.ajax({
    url: "/get_progress", 
    method: "get",
    dataType: "script"
  })
})
</script>

控制器:

def get_progress
  @progress = Progress.last.value
  respond_to do |format|
    format.js
  end
end

get_progress.js.erb:

$("#progress").text("<%= @progress.to_s %>");

要检查一些明显的事情:

  • 您已为“/ get_progress”添加了“get”操作
  • 的正确路由
  • JQuery已安装并正常运行
  • get_progress.js.erb中的代码是正确的。如果JS和嵌入式rails逻辑不能正常工作,通常它看起来像“什么都没发生”。从上面的简单开始......

P.S。要在循环中运行它:

function updateProgress() {
      $.ajax({
        url: "/get_progress", 
        method: "get",
        dataType: "script"
      });
}

// Set the function above to run every 2 seconds
var i = setInterval(updateProgress, 2000);

并更新get_progress.js.erb:

$("#progress").text("<%= @progress.to_s %>");
var checkprogress = <%= @progress.to_i %>;
if (checkprogress == 100) {
   // Stop the function running. Should add clearInterval to error handling of ajax also
   clearInterval(i);
}

修改

如果提交解压缩操作和检索进度之间存在某种冲突,我建议您使用remotipart使解压缩提交异步。然后将表单解压缩为:

<% form_tag '/unzip', :html => { :multipart => true }, :remote => true do %>

并根据remotipart自述文件添加create.js.erb文件<%= remotipart_response do %>。我仍然建议get_progress ajax调用是一个get方法。