簡體   English   中英

成功的ajax請求后,Blueimp Fileupload觸發提交按鈕

[英]Blueimp Fileupload trigger submit button after a successful ajax request

使用blueimp的fileupload如何在ajax請求成功后觸發文件上傳提交? 我試圖觸發fileuploadsubmit,但是它說數據是不確定的。 下面是初始代碼:

HTML:

<form id="add-project-form" method="post" action="http://localhost/project/add/">
    <p>
        <label for="project">Project Name:</label>  
        <input id="project" class="input-text" type="text" name="name" />
    </p>
    <p>
        <label for="overview">Project Overview:</label> 
        <input id="overview" class="input-text" type="text" name="overview" />
    </p>
    <p><input type="submit" value="Add Project" />
</form>

<form id="logo-upload" method="post" action="http://localhost/project/upload/" enctype="multipart/form-data">
    <p>
        <input type="file" name="logo" id="logo" />
    </p>
</form>

jQuery的:

$('#logo-upload').fileupload({
    dataType: 'json',
    maxNumberOfFiles: 1,
    autoUpload: false
}).on('fileuploadsubmit', function(e, data) {
    console.log(data);
});


$(document).on("submit", "#add-project-form", function(e) {
    e.preventDefault();

    var data    = $(this).serialize();
    var url     = $(this).attr("action");

    $.ajax({
        url: url,
        data: data,
        type: "post",
        dataType: "json",
        success: function(response) {
            if( response && response.location != undefined ) {

                // I would want the upload to begin here 

            $('#logo-upload').fileupload().trigger('fileuploadsubmit'); 
            }
        }
    });
});

將提交功能綁定到按鈕上,並在ajax請求后強制單擊:

$('#logo-upload').fileupload({
    dataType: 'json',
    maxNumberOfFiles: 1,
    autoUpload: false,
    add : function(e,data){
             $("#uploadButton").on("click",function(){
                data.submit();
             })
          }
}).on('fileuploadsubmit', function(e, data) {
    console.log(data);
});

 $.ajax({
    url: url,
    data: data,
    type: "post",
    dataType: "json",
    success: function(response) {
        if( response && response.location != undefined ) {
            $("#uploadButton").click();
        }
    }
});

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM