function SubmitAddJobForm(newJobFormElement, progressModalElement, request) {
  var formData = new FormData(newJobFormElement);
  var progressModal = M.Modal.getInstance(progressModalElement);

  progressModal.options.dismissible = false;
  progressModalElement.querySelector(".title").innerHTML = newJobFormElement.title.value;

  request.addEventListener("abort", function(event) {
    progressModalElement.querySelector(".progress-in-percent").innerHTML = "0%";
    progressModalElement.querySelector(".determinate").style.width = "0%";
  });
  request.addEventListener("load", function(event) {
    if (request.status === 201) {
      window.location.href = JSON.parse(this.responseText)['redirect_url'];
    }
    if (request.status === 400) {
      progressModal.close();
      progressModalElement.querySelector(".progress-in-percent").innerHTML = "0%";
      progressModalElement.querySelector(".determinate").style.width = "0%";
      for (let [field, errors] of Object.entries(JSON.parse(this.responseText))) {
        let fieldElement = document.getElementById(field).closest('.input-field');
        for (let error of errors) {
          fieldElement.insertAdjacentHTML('beforeend', '<span class="helper-text red-text">' + error + '</span>');
        }
      }
    }
    if (request.status === 500) {
      location.reload();
    }
  });
  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;
  });

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