如何通过单击按钮排队文件并开始上传？

The code below is calling webapi on drop and will send file one by one. How to get all the files first and upload them all? Because on the server side, I need to put those files in its each unique folder so that multiple users can download theirs but as of now, as this is sending file one by one, It will create a folder for each file which is not ideal. Why?

    function handleFileUpload(files, obj) {
                        for (var i = 0; i < files.length; i++) {
                            var fd = new FormData();
                            fd.append('file', files[i]);
                            var status = new createStatusbar(obj); //Using this we can set progress.
                            status.setFileNameSize(files[i].name, files[i].size);

                        }
                    
                     var submit = $("#submit-button-id");
                     submit.on('click', function (e)
                    {
                        e.preventDefault();
                        alert("clicked nest!")
                        sendFileToServer(fd, status);
                    });
            }

and here is the WEB API AJAX call function: 

 

     function sendFileToServer(formData, status) {
                    var uploadURL = _config.UploadPrismaTemplates;
                    var extraData = {}; //Extra Data.
                    var jqXHR = $.ajax({
                        xhr: function () {
                            var xhrobj = $.ajaxSettings.xhr();
                            if (xhrobj.upload) {
                                xhrobj.upload.addEventListener('progress', function (event) {
                                    var percent = 0;
                                    var position = event.loaded || event.position;
                                    var total = event.total;
                                    if (event.lengthComputable) {
                                        percent = Math.ceil(position / total * 100);
                                    }
                                    //Set progress
                                    status.setProgress(percent);
                                }, false);
                            }
                            return xhrobj;
    
                        },
                        url: uploadURL,
                        type: "POST",
                        contentType: false,//not to set any content header
                        processData: false, //not to process data
                        cache: false,
                        data: formData,
                        success: function (data) {
                            status.setProgress(100);
                           //$("#status1").append("File upload Done<br>");
                            alert("set progress success");
                        },
                        error: function (xhr, status, error)
                        {
                            alert(error);
                        }
                    });
    
                    status.setAbort(jqXHR);
    
                } /*send file to server ends here*/

我尝试过：

What I have tried:

var submit = $("#submit-button-id");
                   submit.on('click', function (e)
                  {
                      e.preventDefault();
                      alert("clicked nest!")
                      sendFileToServer(fd, status);
                  });

我试图将提交按钮中的AJAX调用的sendtoServer函数包装起来但是它逐个发送文件

I tried to wrap the sendtoServer function which is AJAX call in submit button but it is sending files one by one