Как правильно загрузить файл с индикатором выполнения с помощью jQuery ajax () (v. 1.8) - PullRequest
Новая
       13

Как правильно загрузить файл с индикатором выполнения с помощью jQuery ajax () (v. 1.8)

0 голосов
/ 30 января 2019

В веб-приложении я использую загрузку файлов способом ajax.Я объединил старый фрагмент кода xhr с «новым» синтаксисом ajax следующим образом: 

    var ajaxSave = $.ajax({
        url: "http://mydomain.dev/controller/save_frm3",
        type: "POST",
        data: fd, // The FormData
        dataType: "json",
        contentType: false,
        cache: false,
        processData: false,
        xhr: function() {
            var xhr = new window.XMLHttpRequest();
            $(".progress").show(); // Show div with upload progress info
            xhr.upload.addEventListener("progress", function(evt)
            {
                if (evt.lengthComputable)
                {
                    var percentComplete = (evt.loaded / evt.total) * 100;
                    $("#progress-bar").width(percentComplete + '%');
                    $("#progress-val").text(percentComplete);
                }
            }, false);
            return xhr;
        }
    });

    ajaxSave.done(function(response)
    {
        if(response.status == "success")
        {
            console.log("Success response from save - "+JSON.stringify(response.resulttext));
            // Update the form info
            var fileName = response.resulttext.present_pdf_name;
            var fileSize = response.resulttext.present_pdf_size;
        } 
    });

    ajaxSave.fail(function(jqXHR, textStatus, errorThrown) 
    {
        alert(textStatus.charAt(0).toUpperCase() + textStatus.slice(1) + ": " + JSON.stringify(errorThrown));
    });

    ajaxSave.always(function(e)
    {
        // Hide progress div after a while
        $(".progress").delay("3000").fadeOut("slow");
    });

Но я заметил, что даже если файл не загружается (в ajaxSave.fail ()), индикатор выполнения сдвигается до 100%.Должен быть лучший способ обработки xhr, я видел примеры с .progress (), ...

Кто-нибудь использовал сравнимый скрипт или лучшие советы?Я не специалист по отложенным объектам и обещаниям JS, поэтому любые ясные комментарии по этому вопросу приветствуются!

Заранее большое спасибо!

Курт

...