• Как в js прописать очистку формы и проверку инпутов на правильность заполнения?

    wapster92
    @wapster92 Куратор тега JavaScript
    У html есть атрибуты для этого, и можно к ним привязываться, как в интернете множество примеров, вот хорошая статья. Так же есть подобные библиотеки. Для очистки формы в js есть метод reset.
    Ответ написан
    1 комментарий
  • Как в js прописать очистку формы и проверку инпутов на правильность заполнения?

    zkrvndm
    @zkrvndm
    Архитектор решений
    Для проверки правильности заполнения полей в форме используйте атрибут pattern.
    Для отправки формы без перезагрузки страницы jQuery не обязателен, достаточно чистого JavaScript.

    Разместите код ниже на странице с формой:
    <script type="text/javascript">
    
      // По готовности страницы, вешаем на форму обрабочтик onsubmit инлайново:
      document.addEventListener('DOMContentLoaded', function() {
        document.querySelector('form#FORM_ID').setAttribute('onsubmit', 'event.preventDefault(); form_send(this);');
      });
    
      // Функция для отправки формы на чистом JavaScript:
      function form_send(form) {
        var url = form.getAttribute('action') + '?time=' + new Date().getTime();
        var xhr = new XMLHttpRequest(); xhr.open('POST', url);
        xhr.onreadystatechange = function() {
          if (xhr.readyState === XMLHttpRequest.DONE) {
            if (xhr.status === 200) {
              form.setAttribute('onsubmit', 'event.preventDefault();');
              form.innerHTML = xhr.responseText;
            }
            else {
              alert('При отправке формы произошла ошибка, детали смотрите в консоли.');
              console.log('При отправке формы произошла ошибка, ниже объект с деталями ошибки:');
              console.dir(xhr);
            }
          }
        }
        xhr.send(new FormData(form));
      }
      
    </script>

    Только замените FORM_ID на id своей формы! В вашем случае это вроде как order__form. Также обратите внимание, что у вашей формы form должен быть правильно прописан action, если action не указан, то работать НЕ будет.
    Ответ написан
    Комментировать