1. Created a form with the field name, phone, email, city, message. Fields name, email, city - required (required). The message field and telephone are optional.
  2. Phone field <input type="tel" class="inputbox" id="clientPhone" name="telephone"/>
  3. jquery.min.js library has been added to display the phone mask $("#clientPhone").mask("+38(999)999-99-99");

4.Question: if the telephone field is not filled in the form is not sent, how to write a check to send the form when the telephone field is not filled (so as not to take into account the phone mask) in order to make it possible to send the form without the telephone entered?

 $(document).ready(function() { $('#btn-send').click(function(event) { event.preventDefault(); var telephone = $('#clientPhone').val(); if (telephone == "") { $('#clientPhone').addClass('Valid'); return true; } //Проверка поля Имя else { var name = $('#clientName').val(); if (name.length < 2) { $('#clientName').addClass('notValid'); $(this).next().text('Введите, пожалуйста, Ваше имя, не менее двух символов').fadeOut(10000); return false; } //Проверка поля Город else { var city = $('#clientCity').val(); if (city.length < 2) { $('#clientCity').addClass('notValid'); $(this).next().text('Введите, пожалуйста, название Города, не менее двух символов'); return false; } //Проверка поля email else { var email = $('#clientEmail').val(); var filter = /^([a-zA-Z0-9_\.\-])+\@(([a-zA-Z0-9\-])+\.)+([a-zA-Z0-9]{2,6})+$/; if (filter.test(email) == false) { $('#clientEmail').addClass('notValid'); $(this).next().text('Заполните, пожалуйста, поле e-mail. Пример формата поля e-mail: test@test.test'); return false; } //отправка формы если все ок else { $('#userFeedback').submit(); // отправляем форму msg = 'Спасибо, Ваша заявка принята. С Вами свяжутся в ближайшее время'; result = msg; $("#userFeedback").html(result); } } } } }); });
  • one
    Code bits are inedible. - Qwertiy ♦
  • Welcome to StackOverflow. Look carefully at the code in your question and add the skipped if block. - Igor
  • Let me ask: why the HTML attribute placeholder cannot be used together with the pattern attribute ?! - XelaNimed
  • jquery.min.js or jquery.maskedinput.min.js ? digitalbush.com/projects/masked-input-plugin - Gleb Kemarsky

1 answer 1

You have an error in the code that blocks further script execution:

 var telephone = $('#clientPhone').val(); if (telephone === "") { // и да тут лучше использовать тройное равенство. $('#clientPhone').addClass('Valid'); return true; // Вот эта строка вам не дает дальше делать действие, удалите ее и все станет на свои места }
  • There's still else;) - Qwertiy ♦