アップロード者がすべてのファイルを提出するまで待ちます。

Question

アップローダーのコミュニティを送信してください。

私は神人（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. 
    } 
} 


}); 

}); 

：
微アップローダーがアップロードされている場合ように、sumbitボタンを傍受する方法
フォームは送信されません。すべてのアップロードが完了するまで待機し、アップロードされたファイルごとにサーバーから受け取った情報とともに送信します（r esponseJSON）。
私の質問は明確です。

Answer 1

フォームが送信されないようにするには、フォーム送信イベントをリッスンし、ファイルがまだアップロードされていない場合はデフォルトのブラウザアクションを防止します。

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(); 
     } 
    }) 

...あなたのユーザーに警告するために必要なメッセージを自由に追加できます。