1

jQuery File Upload Plugin (https://github.com/blueimp/jQuery-File-Upload) を使用して、レールに複数の写真を同時にアップロードしました。写真がアイテム モデルに添付され、アイテムが投票に追加されます。

プラグインを次のように使用します。

$(document).ready(function(){
    $('#fileupload').fileupload({
      url: '/polls',
      dataType: "json",
      done: function(e,data){
        window.location = "/polls/" + data.result.id;
      }
    }
});

すべてのファイルがアップロードされた後、各写真ファイルに対して投票コントローラーで作成アクションを呼び出し、作成された投票を表示するようにページをリダイレクトする必要がありました。ただし、たとえば、アップロードするファイルを 6 つ選択した場合、最初は投票ページに 4 枚の写真しか表示されませんでした。ページを更新した後、6 枚の写真が表示されました。問題はコールバック関数が原因であると推測しました。すべてのファイルのアップロードが完了する前に、投票ページにリダイレクトさ
れたようです。すべてのアップロード リクエストは正常に送信されるはずですが、すべてのアイテムが作成されたわけではありません (ペーパークリップが画像を処理するのに数秒かかる場合があります)。

この問題を解決するための提案はありますか? ありがとう

編集: http リクエストが成功するたびに、「完了」コールバック関数が実際に呼び出されたことを確認しました。すべてのリクエストが送信された後、呼び出されませんでした。そして、各写真ファイルに対して create アクションが呼び出されました。クライアント側またはサーバー側のいずれかで、すべてのファイルがアップロードされた後にのみコールバックする関数を作成するにはどうすればよいですか?

4

3 に答える 3

3

コールバックを使用して、addアップロードされているファイルをカウントし、コールバックごとにその数を減らすことができdoneます。次に、その番号が の場合にのみリダイレクトを行います0。

このようなもの：

$(document).ready(function(){
    var filesToProcess = 0;
    $('#fileupload').fileupload({
      url: '/polls',
      dataType: "json",
      add: function(e, data){
        filesToProcess++;
      },
      done: function(e,data){
        filesToProcess--;
        if (filesToProcess === 0){
          window.location = "/polls/" + data.result.id;
        }
      }
    }
});
于 2014-02-14T14:25:06.223 に答える
2

done コールバックは、jQuery によって送信される成功コールバックのように機能ajax()しますが、ファイルのアップロードが完了したことを意味するわけではありません。使ってみて

$('#fileupload').bind('fileuploaddone', function (e, data) {/* ... */})

上記の方法でうまくいくかどうかわかりませんが、試してみてください。そうでない場合は、サーバー側でメソッドを記述して、アップロードが完了したときにレポートを返すことができます。

于 2012-11-26T04:22:10.880 に答える