Как запретить открытие всплывающего окна, если не заполнена форма?

Question

[picheldos]

Есть форма:

<form method="post">
            <input type="text" name="name" class="form-control" placeholder="Ваше имя" maxlength="50" required id="id_name"> 
            <input type="text" name="phone" class="form-control" placeholder="Номер телефона" maxlength="12" required
id="id_phone"> 
            <input type="text" name="address" class="form-control" placeholder="Ваш адрес" maxlength="50" id="id_address"> 
            <textarea name="problem" cols="40" rows="10" class="form-control" placeholder="Суть проблемы" maxlength="350" id="id_problem"></textarea>
            <button  class="btn btn-success" type="submit" onclick="foo()">Оставить заказ</button>

Есть функция:

function foo(){
            document.location.href="#dark"
        }

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

Answer 1

[Web Dentist]

<form method="post" id="support-form">

let form = document.querySelector('#support-form');
if (form.checkValidity()) document.location.href="#dark"

Comments

[picheldos]

Большое спасибо. Все работает.