Vanilla AJAX with FormCarry

form.js

/**
 * Form
 */
function init() {
  if (document.forms[0] && window.FormData) {
    const form    = document.forms[0];
    const button  = form.querySelector('.button');
    const request = new XMLHttpRequest();

    request.open('POST', 'https://formcarry.com/s/XXXXXXXX', true);
    request.setRequestHeader('accept', 'application/json');

    form.addEventListener('submit', function (e) {
      e.preventDefault();
      const formData = new FormData(form);

      button.disabled = true;
      button.classList.add('is-loading');

      request.send(formData);
      request.onreadystatechange = function () {
        if (request.status == 200) {
          button.classList.remove('is-loading', 'is-primary');
          button.classList.add('is-success');
          button.innerHTML = 'Thank you!';
        } else {
          button.disabled = false;
          button.classList.remove('is-loading', 'is-primary');
          button.classList.add('is-danger');
          button.innerHTML = 'Try again.';
        }
      }
    });
  }
}

export default {
  init,
}