Почему не работает условие в скрипте Jquery?

Question

[Tutucu]

Создал скрипт, который активируется при нажатии на кнопку и отправке формы. Внутри функции условие, если в форме "Телефон" длина строки не равна 12 или 11, то вылезает alert, если равна - отправляется письмо. Но при нажатии на кнопку - форма отправляется ВСЕГДА, какая бы длина строки не была.
В чём проблема? Никаких ошибок в консоли - нет.

$("#front_form").submit(function() { //устанавливаем событие отправки для формы с id=form
            event.preventDefault();
            if($('input[name="PHONE"]').val().length == 11 || $('input[name="PHONE"]').val().length == 12){
                var form = document.forms.front_form;

                var formData = new FormData(form);  

                var xhr = new XMLHttpRequest();
                xhr.open("POST", "/php/front-call.php");

                xhr.onreadystatechange = function() {
                    if (xhr.readyState == 4) {
                        if(xhr.status == 200) {
                            data = xhr.responseText;
                            if(data == "true") {
                                alert("Ошибка... Повторите попытку");
                            } else {
                                alert("Ваша заявка на звонок - отправлена! В ближайшее время наш сотрудник свяжется с вами.");
                            }
                        }
                    }
                };

                xhr.send(formData);
            }
            else{
                alert("Номер Телефона должен быть указан в формате '[phone]' или '[phone]'");
            }
});

<form id="front_form" class="form-banner" enctype="multipart/form-data" method="post">
                            <div class="row">
                                <div class="col-sm-12 banner__form-title">
                                    Форма быстрой заявки:
                                </div>
                                <div class="col-sm-12 block-input">
                                    <input type="text" class="call-popup__input" placeholder="Имя" name="FNAME" required="required">
                                </div>
                                <div class="col-sm-12 block-input">
                                    <input type="text" class="call-popup__input" placeholder="Мобильный телефон" name="PHONE" required="required">
                                </div>
                                <div class="col-sm-12 block-input">
                                    <input type="text" class="call-popup__input" placeholder="Электронная почта" name="EMAIL" required="required">
                                </div>
                                <div class="col-sm-12 block-input">
                                        <div class="file-label">Файл копий свидетельств ОГРН, ИНН</div>
                                        <div class="file-input-back">
                                            <span class="title-file__text">Прикрепить файл</span>
                                            <label for="file-input" class="file-label"></label>
                                            <input id="file-input" type="file" class="file-xer" name="file-ottisk" value="Восстановить печать по оттиску" required="required">
                                        </div>
                                        <input type="text" id="filename-front" class="filename file-input-hidden" disabled>
                                </div>
                                <div class="col-sm-12 call-button">
                                    <input type="submit" class="button call-popup__button banner__button" name="subscribe" value="Заказать печать, ЖМИ!">
                                </div>
                            </div>
                        </form>