等到優秀的上傳者提交之前提交所有文件

上傳者的社區！

我正在嘗試整合精美的上傳器與神社（ROR）。
我已經能夠將圖像上傳到服務器端點。
爲了存儲上傳的照片，我確定選擇使用我現有的表單通過ajax發送上傳的照片信息（從服務器接收）。等到優秀的上傳者提交之前提交所有文件

我的存在形式是這樣的

<form id="myform" method="post" action="some_path"> 
    <input type="text" name="name"/> 
    <input type="text" name="email"/> 
    <input type="text" name="phone"/> 
    <input type="password" name="password"/> 
    <input type="submit" /> 
    Add some photos 
    <div id="fine-uploader-gallery"></div> 
</form>

我精上傳配置：

$(function() { 

var fineuploader = new qq.FineUploader({ 
    element: document.getElementById("fine-uploader-gallery"), 
    template: 'qq-template-gallery', 
    debug: true, 
    request: { 
    endpoint: 'images/cache/upload', 
    inputName: "file" 

    }, 
    thumbnails: { 
    placeholders: { 
     waitingPath: "fine-uploader/placeholders/waiting-generic.png", 
     notAvailablePath: "fine-uploader/placeholders/not_available-generic.png" 

    } 

    }, 
    validation: { 
    allowedExtensions: ['jpeg', 'jpg', 'gif', 'png'] 

    } 

    callbacks: { 
    onComplete: maybe add the responseJSON to a local variable and send it later with the form via ajax. 
    } 
} 


}); 

});

我的問題是：
如何攔截透過按鈕，這樣，如果細上傳者上傳一些文件：
表單不會被髮送，它會一直等到所有上傳完成，然後將其與每個上傳文件從服務器收到的信息一起發送（r esponseJSON）。
希望我的問題很明確！

來源

2016-09-25 mma7

爲什麼你的表單元素裏面有很好的上傳器渲染？這看起來不正確。 –

我不知道？有沒有特定的原因？我不介意更改我的代碼。 – mma7

我當然不知道原因。這是你的代碼，不是嗎？ –

您可以通過偵聽表單提交事件並阻止默認瀏覽器操作（如果文件尚未上傳）來阻止提交表單。

document.getElementById('myForm') 
    .addEventListener('submit', function(event) { 
     var totalFiles = fineuploader.getUploads().length; 
     var successfulUploads = fineuploader.getUploads({ 
     status: qq.status.UPLOAD_SUCCESSFUL 
     }).length; 

     if (totalFiles !== successfulUploads) { 
     event.preventDefault(); 
     } 
    })

...隨時添加任何消息，以提醒您的用戶的問題。

來源

2016-09-26 13:35:59

等到優秀的上傳者提交之前提交所有文件

回答

相關問題