Как предотвратить отправку формы перед отображением индикатора выполнения - PullRequest
Новая
       0

Как предотвратить отправку формы перед отображением индикатора выполнения

1 голос
/ 11 октября 2010

Я использую Uploadify для приложения реального времени, и пока он работает нормально, за исключением этой проблемы. У меня есть 6 кнопок «Обзор» для загрузки 6 файлов (с несколькими «true» для каждого), и у меня также есть кнопка «Отправить» на моей странице (JSP).

Если пользователь выбирает файл с помощью одной из этих кнопок «Обзор», перед отображением индикатора выполнения после выбора файла будет небольшая задержка. В то же время, если пользователь нажимает кнопку «Отправить», форма отправляется еще до того, как отображается индикатор выполнения, и НЕТ файл загружен. Я посмотрел на доступные методы, но не смог найти решение до сих пор.

Я высоко ценю и надеюсь на любую помощь в этом вопросе.

Спасибо.

Пожалуйста, найдите мой код ниже: 

    $("#vehShortTestAttachment1").uploadify({
        'uploader'  : '../pts/swf/uploadify.swf',
        'script'    : url,
        'cancelImg' : '../pts/images/cancel.png',
        'wmode'     : 'transparent',
        'hideButton': 'true',
        'width'     : 67,
        'height'    : 20,
        'multi'     : true,
        'sizeLimit' : 20971520,
        'fileDesc'  : 'jpg, gif, doc, ppt, jpeg, txt, pdf',
        'fileExt'   : '*.jpg;*.gif;*.doc;*.ppt;*.jpeg;*.txt;*.pdf',
        'onCancel': function () {
            $('#attachments-div-validation').html("");
            isFileBig = false;  
        },
        'onSelectOnce': function (event, queueID, fileObj) {        
            $("#attachments-submit-case-button").attr("disabled", true); 
        },
        'onSelect': function (event, queueID, fileObj) {        

                $("#attachments-div-validation").html(div_validation_red_start + "<B>You can select other files (or) Submit the Case now.</B>" + div_validation_red_end);
            $("#attachments-div-validation").show();

            if (fileObj.size > 20971520) 
            {               
                $('#attachments-div-validation').html(div_validation_red_start + "Size of the file: " + fileObj.name + " exceeds 20MB and this file can not be uploaded. <br>Please click on the X button on the progress bar for this file to cancel the upload. <br>Please click on BROWSE button again to upload another file." + div_validation_red_end);
                $('#attachments-div-validation').show();    
                isFileBig = true;                                       
            }
        },
        'onComplete': function(event, queueID, fileObj, response, data)
        {                               
            if(response == 'OK') {
                $('input[name=fileUploadStatus]').val(response);
                $("#vehShortTestAttachment1").uploadifySettings('script', url);
            }
            else {
                $('input[name=fileUploadStatus]').val(response);
                $('#vehShortTestAttachment1').uploadifyCancel(queueID);
                $('#vehShortTestAttachment1').uploadifyClearQueue();                    
            }
        },
        'onAllComplete':function(event, data) 
        {                       
            $("#attachments-submit-case-button").attr("disabled", false); 

            if(!isFileBig)
                submitFormDetails();
        }
    });

Ответы [ 3 ]

2 голосов
/ 11 октября 2010

Вы можете проверить, присутствуют ли элементы загрузки, когда пользователь пытается отправить форму 

$("form").submit(function(evt) {
    if ($(".uploadifyQueueItem").children().length > 0) {
        evt.preventDefault();
        alert("There are still files to upload...");
    }
    //...
});

Изменить: Только что проверил документацию

Почему бы не отключить кнопку отправки, когда файл выбран, и включить его в onAllComplete. 

$("#fileInput").uploadify({
    //...
    onSelectOnce: function() {
        $("#btn_submit").attr("disabled", true);
    },
    onAllComplete: function() {
        $("#btn_submit").attr("disabled", false);
    }
});
0 голосов
/ 02 февраля 2011

Событие onselect: 

'onSelect': function (e, fileID, fileObj) {
      $(".editor-form-submit").show();
}

к сожалению, только запускается ПОСЛЕ того, как SWF-файл проверяет размер файла и т. Д. Вот почему между выбором файла и фактическим событием select существует короткое время, в которое пользователь может отправить форму.

Если кто-нибудь знает о том, что событие «до загрузки SWF» откроет диалоговое окно, это было бы очень полезно.

0 голосов
/ 18 октября 2010

Просто выдержка, но это примерно то, что я использую ... 

    onInit           : function ( ) {
        $('#uploadbtn').attr('disabled', true);
    },
    onSelect         : function (a, b, c, d, e) {
        $('#uploadbtn').attr('disabled', false);
    },

Я не уверен, почему у вас есть 6 кнопок просмотра ... но я не думаю, что это имеет значение вэто дело.

...