Why is the form submitted to the server despite return false?

Question

AJAX

Newbie, do not throw slippers)
Here is the js:

if (document.querySelector('.user-info__name').validity.valid && document.querySelector('.user-info__email').validity.valid && document.querySelector('.user-info__ms').validity.valid) {
        if (sendData('handler.php', {
            key: 6,
            type: document.querySelector('.user-info__select').value,
            name: document.querySelector('.user-info__name').value,
            email: document.querySelector('.user-info__email').value,
            text: document.querySelector('.user-info__ms').value
        })) {
            popup('Сообщение принято!', 'send.svg');
        }
    }
    return false;
});

For some reason, the form is sent via action and does not allow the ajax request to be executed.
Although in similar code everything works fine:

document.querySelector('.footer__submit').addEventListener('click', function () {
    var email = document.querySelector('.footer__email');
    if (email.validity.valid) {
        if (sendData('handler.php', {key: 5,email: email.value}))  {
            popup('Спасибо! Вы подписаны!', 'send.svg');
            email.value = "";
        }
    }
    return false;
});

How to solve the problem?
I will be grateful for your help!