Проверка формы на кнопке отправки, которая ведет к другой части формы - PullRequest
Новая
       12

Проверка формы на кнопке отправки, которая ведет к другой части формы

0 голосов
/ 10 декабря 2018

У меня есть форма из двух частей внутри iframe.В первой части формы есть кнопка «Отправить», в которой имеется прослушиватель событий, при нажатии которого открывается страница 2 iframe (часть 2 формы).Submit регистрирует прослушиватель событий modalInitialCta.addEventListener('click', openModalSelector); перед проверкой валидации.Мне нужно, чтобы проверить валидацию, а затем openModalSelector.Пожалуйста помоги!Заранее спасибо!

Вот первая часть формы HTML: 

<form id="theForm" onsubmit="return checkForm(this);"> 
<table class="inputFieldSet">
    
    <tr class="leftAligned">
        <td class="leftAlignedL">
        <p class="inputTitleL">First Name</p>
        <input class="fillableFieldL" type="text" name="first-name" onfocus="this.value=''" pattern="^[a-zA-Z ,.'-]+$" required>
        </td>
        <td class="leftAlignedL">
        <p class="inputTitleL">Last Name</p>
        <input class="fillableFieldL" type="text" name="last-name" onfocus="this.value=''" pattern="^[a-zA-Z ,.'-]+$" required>
        </td>
    </tr>
    
    <tr class="leftAligned">
        <td class="cell">
        <p class="inputTitle">Email</p>
        <input class="fillableField" type="email" name="email" onfocus="this.value=''" required>
        </td>
    </tr>
    
    <tr class="leftAligned">
        <td class="cell">
        <p class="inputTitle">Password</p>
        <input class="fillableField" type="password" name="password" onfocus="this.value=''" required>
        </td>
    </tr>
    
</table>

<div class="form">
<p><input external-event="submit" id="modal-initial-cta" class="submit" type="submit" value="START CLIMBING TODAY" onSubmit="return openModalSelector"></p>
</div>  
</form>

и вот Javascript относительно кнопки: 

let modalInitialCta = document.getElementById('modal-initial-cta');

function openModalSelector () {
    modalInitial.style.display = "none";
    modalInstructions.style.display = "none";
    modalSelector.style.display = "block";
  }

modalInitialCta.addEventListener('click', openModalSelector);
...