如何强制此jquery等到click事件结束?

时间:2014-10-24 19:09:34

标签: javascript c# jquery asp.net ajax

我正在使用Ajax文件上传,除了其他事件之外,它还重载了onClientUploadCompleteAll事件。我在点击jquery中的Upload按钮后执行导航,我想强制该函数等到onuploadcompleteall执行之后再执行导航。现在它在uploadcompleteall运行之前导航到下一页。有没有办法强制它等待,或者获取用户在onuploadcompleteall事件中点击的内容?

<asp:AjaxFileUpload ID="AjaxFileUpload1" CssClass="0001.01" runat="server" AllowedFileTypes="jpg,jpeg,png,gif" OnUploadStart="AjaxFileUpload1_UploadStart" OnUploadComplete="AjaxFileUpload1_UploadComplete" OnUploadCompleteAll="AjaxFileUpload1_UploadCompleteAll" OnClientUploadComplete="onClientUploadComplete" OnClientUploadCompleteAll="onClientUploadCompleteAll" OnClientUploadStart="onClientUploadStart"></asp:AjaxFileUpload>

onClientUploadCompleteAll事件:

function onClientUploadCompleteAll(sender, e) { //stuff }

执行点击的文件上传事件:

function handleFileUpload(form) {
    number_of_plugin_instances_having_photos = 0;

    $('.upload-photos').map(function(i, el){
        if($('.uploaded-thumbnail', el).length > 0 || $('.uploaded-thumbnail-title', el).length > 0) {
            number_of_plugin_instances_having_photos++;
        }
    });

    if(number_of_plugin_instances_having_photos == 0) {
        form.submit();
    } else {

        //setTimeout(function(){

            number_of_plugin_instances_callbacks_uploaded = 0;

            $('.upload-photos').map(function(i, el){
                if($('.uploaded-thumbnail', el).length > 0 || $('.uploaded-thumbnail-title', el).length > 0) {
                    $('.ajax__fileupload_uploadbutton', el).trigger('click');
                }
            });
        //}, 1000);

    }
}

调用文件上传事件

$.ajax({
        type: "POST",
        url: loc + "/SubmitSections",
        data: dataValue,
        contentType: 'application/json; charset=utf-8',
        dataType: 'json'
    })
    .done(function (data, status) {
        if (data.d != "success") {
            $("#modal-submitting").modal('hide');
            $(".error_message").text("Unable to submit the data entered.  Please try again.  Additional Details: " + data.d);
            $("#modal-error-occurred").modal('show');
        }
        else {
            handleFileUpload(form, true);

            //NEED TO WAIT BEFORE NAVIGATING OTHERWISE COMPLETE ALL DOES NOT EXECUTE
            document.location = "general-appearance.aspx";
        }
    })
    .fail(function (data, status) {
        if (data.d != "success") {
            $("#modal-submitting").modal('hide');
            $(".error_message").text("Unable to submit the data entered.  Please try again.  Additional Details: " + data.d);
            $("#modal-error-occurred").modal('show');
        }
        else {
            handleFileUpload(form, true);

            //NEED TO WAIT BEFORE NAVIGATING OTHERWISE COMPLETE ALL DOES NOT EXECUTE
            document.location = "general-appearance.aspx";
        }
    });//ajax call end

1 个答案:

答案 0 :(得分:0)

原来我可以使用表单操作来获取用户选择导航的位置。在onClientUploadCompleteAll我放置了以下内容:

function onClientUploadCompleteAll(sender, e) {

    //I have more than one photo upload
    number_of_plugin_instances_callbacks_uploaded++;

    if(number_of_plugin_instances_callbacks_uploaded == number_of_plugin_instances_having_photos){
        var first_form = $('form')['0'];
        var nextPage = first_form.action;

        document.location = nextPage;
        //first_form.submit();
    }
}