Как вызвать новую функцию javascript в случае успеха предыдущего (Проверка формы) - PullRequest
Новая
       5

Как вызвать новую функцию javascript в случае успеха предыдущего (Проверка формы)

0 голосов
/ 17 января 2019

У меня есть форма, написанная другим разработчиком (я на самом деле не разработчик, скорее дизайнер, чем программист) ... и я пытаюсь добавить проверку, когда данные формы не отправляются / не отправляются по электронной почте до тех пор, пока поле проверки успешны.

Я получил многое из того, что хотел бы, но я застрял, когда кнопка запускает проверку, а затем вызывает функцию, отправляющую данные.

Мне это нужно как можно быстрее, так что любой, кто действительно может помочь ... ценит это очень! 

<div class="contactForm">
    <form id="contactForm">
    <input type="hidden" name="subject" placeholder="Subject" data-send="true"/>
    <input type="text" name="name" placeholder="Name*" data-send="true" required />
    <input type="tel" name="phone" placeholder="Phone* (format: xxx-xxx-xxxx)" pattern="^\d{3}-\d{3}-\d{4}$" required />
            <input type="email" name="email" placeholder="Email*" data-send="true" required />
    <input type="text" name="note" placeholder="Note" data-send="true"/>
    <input id="sendForm" type="button" value="Send"
            data-template="indextemplate"
            data-handle="contactForm"
            data-script="system/form_email.php"
            data-pending="Your inquiry is being sent..."
                    data-success="Thank you! We will reach out to you as soon as we can!"/>
                            <span class="icon_spin"></span>
            <span class="message"></span>
    </form>
</div>
</div></div>

<script type="text/javascript" src="<?=@$prefix;?>js/email.form.js"></script>
<script>
    $('#sendForm').click(function(event) {

    const inputs = document.querySelectorAll('input, select, textarea');

    for(let input of inputs) {
      input.addEventListener('invalid', (event) => {
      input.classList.add('error');    
      }, false);

      input.addEventListener('blur', (event) => {
      input.checkValidity();
      })

    }
    on success -> { submitForm(); }
    }

    $('.bullets input[name="contact"]').click(function(){
$('#contactForm input[name="subject"]').val($(this).next().find('.subject').text());
    });

    function sendForm() {
     var edata = {
      handle: $('#sendForm').data('handle'),
      script: $('#sendForm').data('script'),
      success: $('#sendForm').data('success')
     };
     $('#sendForm').addClass('sending');
     $('#message').text($('#sendForm').data('pending'));
     var formdata = new FormData();
     formdata.append('subject', $('input[name="subject"]').val());
     formdata.append('name', $('input[name="name"]').val());
     formdata.append('phone', $('input[name="phone"]').val());
     formdata.append('email', $('input[name="email"]').val());
     formdata.append('note', $('input[name="note"]').val());
     formdata.append('template', $('#sendForm').data('template'));
     emailForm(formdata, edata);
    });
</script>

Я бы хотел, чтобы форма вообще не отправлялась / не отправлялась по электронной почте до тех пор, пока необходимые поля не будут заполнены правильно. Также было бы неплохо, чтобы пользователь указывал на то, что требуется отправить.

...