Валидация формы и отправка через AJAX

Сбор данных через FormData, клиентская проверка и отправка без перезагрузки страницы.

const form = document.querySelector('#feedback-form');

const validators = {
  email: (v) => /^[^\s@]+@[^\s@]+\.[^\s@]{2,}$/.test(v) || 'Некорректный email',
  message: (v) => v.trim().length >= 10 || 'Минимум 10 символов',
};

form?.addEventListener('submit', async (event) => {
  event.preventDefault();
  const data = Object.fromEntries(new FormData(form));

  const errors = Object.entries(validators)
    .map(([field, check]) => [field, check(data[field] ?? '')])
    .filter(([, result]) => result !== true);

  form.querySelectorAll('.error').forEach((el) => el.remove());
  if (errors.length) {
    errors.forEach(([field, message]) => {
      form.elements[field].insertAdjacentHTML(
        'afterend', `<span class="error">${message}</span>`
      );
    });
    return;
  }

  const button = form.querySelector('button[type=submit]');
  button.disabled = true;
  try {
    const response = await fetch(form.action, {
      method: 'POST',
      body: new FormData(form),
      headers: { 'X-Requested-With': 'XMLHttpRequest' },
    });
    if (!response.ok) throw new Error(`HTTP ${response.status}`);
    form.reset();
  } finally {
    button.disabled = false;
  }
});