function SubmitAddJobForm(newJobFormElement, progressModalElement, request) { var formData; var progress; var progressModal; formData = new FormData(newJobFormElement); progressModal = M.Modal.getInstance(progressModalElement); progressModal.options.dismissible = false; progressModalElement.querySelector(".title").innerHTML = newJobFormElement.title.value; request.upload.addEventListener("progress", function(event) { progressInPercent = Math.floor(100 * event.loaded / event.total).toString() + "%"; progressModalElement.querySelector(".progress-in-percent").innerHTML = progressInPercent; progressModalElement.querySelector(".determinate").style.width = progressInPercent; }); request.addEventListener("load", function(event) { console.log(request.response); newJobFormElement.reset(); location.reload(); }); request.addEventListener("abort", function(event) { progressModalElement.querySelector(".progress-in-percent").innerHTML = "0%"; progressModalElement.querySelector(".determinate").style.width = "0%"; }); progressModal.open(); request.open("POST", window.location.href); request.send(formData); } function initAddJobForm(addJobFormElement, progressModalElement) { var request; request = new XMLHttpRequest(); addJobFormElement.addEventListener("submit", function(event) { event.preventDefault(); SubmitAddJobForm(addJobFormElement, progressModalElement, request); }); progressModalElement.querySelector(".cancel").addEventListener("click", function(event) { request.abort(); }); }