Форма авторизации(ошибки) HTML&PHP&JS в модальном окне

Есть форма с авторизацией. Когда вводим логин и пароль которые не содержаться в СУБД, то страница просто обновляется и не возвращает модальное окно. Как сделать так чтобы у меня модальное окно не закрывалось при отправке формы если я не указал логина или пароля - и чтобы ошибка показалась. Спасибо.

PHP - 
$errMsg = [];

if ($_SERVER['REQUEST_METHOD'] === 'POST' && isset($_POST['button-reg']) ) {
    $gid = 0;
    $login = $_POST['login'];
    $email = $_POST['email'];
    $passF = $_POST['pass-first'];
    $passS = $_POST['pass-second'];
    $ip = $_SERVER['REMOTE_ADDR'];
    $time = time();

    if (empty($login) || $email === ''){

        $errMsg = "Не всі поля заповнені";
    } else {
            $pass = password_hash($passF, PASSWORD_DEFAULT);
            $post = [
                'gid' => $gid,
                'login' => $login,
                'email' => $email,
                'password' => $pass,
                'ip_create' => $ip,
                'time_create' => $time
            ];
            $id = insert('users', $post);
            $users = selectOne('users', ['id' => $id]);
        }
} else {
    echo 'get';
}

JS -
const popupLinks = document.querySelectorAll('.popup-link');
const body = document.querySelector('body');
const lockPadding = document.querySelectorAll(".lock-padding");

let unlock = true;

const timeout = 800;

if (popupLinks.length > 0) {
    for (let index = 0; index < popupLinks.length; index++){
        const popupLink = popupLinks[index];
        popupLink.addEventListener("click", function (e){
            const popupName = popupLink.getAttribute('href').replace('#', '');
            const curentPopup = document.getElementById(popupName);
            popupOpen(curentPopup);
            e.preventDefault();

        });
    }
}

const popupCloseIcon = document.querySelectorAll('.close-popup');
if (popupCloseIcon.length > 0) {
    for (let index = 0; index <popupCloseIcon.length; index++){
        const el = popupCloseIcon[index];
        el.addEventListener('click', function (e) {
            popupClose(el.closest('.popup'));
            e.preventDefault();

        });
    }
}

function popupOpen(curentPopup){
    if (curentPopup && unlock){
        const popupActive = document.querySelector('.popup.open');
        if (popupActive){
            popupClose(popupActive, false);
        }
        curentPopup.classList.add('open');
        curentPopup.addEventListener("click", function (e){
           if (!e.target.closest('.popup__content')){
               popupClose(e.target.closest('.popup'));
           }
        });
    }
}

function popupClose(popupActive, doUlock = true){
    if (unlock){
        popupActive.classList.remove('open');
        if (doUlock){
            bodyUnlock();
        }
    }
}

function bodyLock() {
    const lockPaddingValue = window.innerWidth - document.querySelector('.wrapper').offsetWidth + 'px';

    for (let index = 0; index < lockPadding.length; index++){
        const el = lockPadding[index];
        el.style.paddingRight = lockPaddingValue;
    }
    // body.style.paddingRight = lockPaddingValue;
    body.classList.add('lock');

    unlock = false;
    setTimeout(function (){
        unlock = true;
    }, timeout);
}

function bodyUnlock() {
    setTimeout(function (){
        if (lockPadding.length > 0){
        for (let index = 0; index < lockPadding.length; index++){
            const el = lockPadding[index];
            el.style.paddingRight = '0px';
            }
        }
        body.style.paddingRight = '0px';
        body.classList.remove('lock');
    }, timeout);

    unlock = false;
    setTimeout(function (){
        unlock = true;
    }, timeout);
}


const checker =  document.getElementById('check-me');
const button =   document.getElementById('send');

checker.addEventListener('change', (e) => {
    if (checker.checked){
       button.disabled = false;
       // button.style.
   } else {
       button.disabled = true;
   }
});

HTML - popup
<div id="popup" class="popup">
    <div class="popup__body">
        <div class="popup__content">
            <div class="popup__title">Register</div>
            <div class="form-list">
                <form class="form" method="post" action="#popup">
                    <div class="form">
                        <label>
                            <?= $errMsg; ?>
                            <input name="login" type="text" placeholder="LOGIN">
                        </label>
                    </div>
                    <div class="form">
                        <label>
                            <?= $errMsg; ?>
                            <input name="email" type="text" placeholder="Ваш email">
                        </label>
                    </div>
                    <div class="form">
                        <label>
                            <input name="pass-first" type="password" placeholder="Пароль">
                        </label>
                    </div>
                    <div class="form">
                        <label>
                            <input name="pass-second" type="password" placeholder="Повторите пароль">
                        </label>
                    </div>
                    <div class="rules">
                        <label>
                            <input id="check-me" class="check" type="checkbox">
                        </label>
                        <span class="rules-text">Я `полностью согласен и ознакомлен` с правилами <a class="rules-help" href="#">1</a></span>
                    </div>
                    <div class="form-button">
                        <button id="send" type="submit" disabled="disabled" name="button-reg" class="button-auth">`Зарегистрироваться`</button>
                    </div>
                    <div class="account-link">
                        <a class="account-link-auth popup-link" href="#popup2">`Есть` аккаунт?</a>
                    </div>
                </form>
            </div>
        </div>
    </div>
</div>

Уже не знаю что пробовать) подскажите.