3

ファイルをアップロードして解凍するときに、進行状況のパーセンテージを表示しようとしています。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、値を解凍してデータベースに保存するすべてのものがあります。.progress divさて、 2秒ごとに更新したいと思います。まず、ボタンがクリックされたときに 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ます。

しかし、問題は、xhr.send((s.hasContent && s.data) || null)jquery1.6.3 行番号 7948 でエラーが発生していることです。このページは ajax 呼び出し中に別の場所にリダイレクトされ、呼び出し中に別の要求が行われているため、このエラーが発生していると思いますフォームが送信されたときに呼び出される別のアクションがあることは明らかです。

次のようにして、ajax呼び出しでエラーを出力すると：

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

私はこれを取得しています：

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

私の問題はこの質問に似ていると思います。しかし、ここに提示された答えは私の問題を解決しませんでした。

この問題を解決する方法はありますか? 質問が明確であることを願っています！

4

1 に答える 1

1

postajax呼び出しを aからa に変更したとき、これはうまくいくようです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」アクションで「/get_progress」の正しいルートを追加しました
  • JQuery がインストールされ、動作している
  • get_progress.js.erb のコードが正しいこと。JS と埋め込まれた Rails ロジックが正しく機能していない場合、多くの場合、「何も起こっていない」ように見えます。上記のような簡単なことから始めてください...

PSループで実行するには：

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 readme に従ってcreate.js.erbファイルを追加します。<%= remotipart_response do %>get_progress ajax 呼び出しは get メソッドであることを引き続きお勧めします。

于 2012-10-15T19:24:43.013 に答える