1

次のことについての助けは、ありがたく受け入れられます。

ページにさまざまな数の Ajax ファイルのアップロードがあり、それぞれが独自のフォームに含まれているというシナリオがあります。各フォームの onSubmit アクション中に、PostFile() という別のメソッドを呼び出して、次のようにファイルのアップロードを実行します。

function PostFile(fileInputId, id) {

    var formdata = new FormData();
    var fileInput = $('#fileinput' + '_' + id)[0];

    formdata.append(fileInput.files[0].name, fileInput.files[0]);
    formdata.append("Id", id);

    //Creating an XMLHttpRequest and sending
    var xhr = new XMLHttpRequest();
    xhr.open('POST', '/Bookings/UploadArtwork');

    xhr.send(formdata);
    xhr.onreadystatechange = function () {
        if (xhr.readyState == 4 && xhr.status == 200) {            

            if ($.ajax.active == 0) {

                NoOtherFilesBeingUploaded();
            }
        }
    };
}

私の問題は、ページ上の他のフォームを介して現在アップロードされている他のファイルがない場合にのみ NoOtherFilesBeingUploaded() 関数を実行したいということです。つまり、進行中の XMLHttpRequest が他にない場合です。

事実上、現在開いている XMLHttpRequests のカウンターが必要です。ただし、XMLHttpRequests イベントに対して ajaxStart() が起動しないため、$.ajax.active は常に 0 であることを発見しました。

誰にもアイデアはありますか？

前もって感謝します

アップデート：

私は XMLHttpRequest を使用しているので、次のように進行状況バーを追加できます。

xhr.upload.addEventListener("progress", function (event) {

    if (event.lengthComputable) {
        var percentComplete = Math.round(event.loaded * 100 / event.total);
        $('#progressNumber_' + id).html(percentComplete.toString() + '% complete');
    }
    else {
        $('#progressNumber_' + id).html('unable to compute');
    }
}, false);

これを元の投稿から除外して申し訳ありません。

4

2 に答える 2

0

さて、これが私がそれを機能させた方法です：

function PostFile(fileInputId, id) {

    var formdata = new FormData();
    var fileInput = $('#fileinput' + '_' + id)[0];

    formdata.append(fileInput.files[0].name, fileInput.files[0]);
    formdata.append("id", id);

    $.ajax({
        url: '/Bookings/UploadArtwork',
        data: formdata,
        cache: false,
        contentType: false,
        processData: false,
        type: 'POST',
        xhr: function()
        {
            var xhr = new window.XMLHttpRequest();

            xhr.upload.addEventListener("progress", function (evt) {
                if (evt.lengthComputable) {
                    var percentComplete = Math.round(evt.loaded * 100 / evt.total);
                    $('#progressNumber_' + id).html(percentComplete.toString() + '% complete');
                }
            }, false);

            xhr.addEventListener("loadend", function (evt) {
                if ($.active == 0) {
                    NoOtherFilesBeingUploaded();
                }
            }, false);

            return xhr;
        },
        success: function (data) {

        }
    });
}

Dave Bond に感謝: http://www.dave-bond.com/blog/2010/01/JQuery-ajax-progress-HMTL5/

于 2013-08-13T17:22:01.970 に答える