Есть альтернатива jQuery Form Plugin без jQuery?

Есть альтернатива jQuery Form Plugin без jQuery?


Есть альтернатива jQuery Form Plugin без использование библиотеки jQuery?

https://malsup.com/jquery/form/

Ответ:

Это делается в один абзац кода на чистом JavaScript:

<script>
  
  // Обрабочик для отслеживания готовности страницы:
  
  document.addEventListener('DOMContentLoaded', function() {
    
    // Ставим на форму обработчик срабатывающий при отправке формы:
    
    document.querySelector('form').addEventListener('submit', async function() {
    
      var this_form = this; // Получаем ссылку на форму
      event.preventDefault(); // Отменяем обычную отправку
      
      // Блокируем нажатия по форме:
      
      this_form.style.opacity = '0.5';
      this_form.style.pointerEvents = 'none';
      
      // Блок кода для отправки формы:
      
      try {
        
        // Отправляем форму без перезагрузки страницы и выводим ответ сервера на месте формы, как обычный текст:
        
        this_form.outerHTML = await (await fetch(this_form.action, { method: 'POST', body: new FormData(this_form) })).text();
        
      }
      
      // Блок кода для обработки ошибок:
      
      catch(err) {
        
        // Вывод ошибки, если вдруг отправка неудачная:
        console.error(err); this_form.outerHTML = err.toString();
        
        // Разблокируем форму:
        
        this_form.style.opacity = '';
        this_form.style.pointerEvents = '';
        
      }
      
    });
    
  });
  
</script>


Report Page