Почему не работает проверка при отправке формы?

Question

[Genri_Rus]

Вот пример: https://codepen.io/Genri_Rus/pen/YzzzNMY

Проблема в том, что при вводе валидного email, красный border не заменятся на другой цвет

Answer 1

[Сергей c0re]

Дело в том что у вас проверка email выполняется только в том случае если не выполняется условие по имени:

if ($('#name').val().length >= 3) {
      $(this).find('#name').css("border", "1px solid rgb(169, 169, 169)");
  } else if ($('#email').val().length > 10 && $('#email').val().search(pattern) == 0) {
    $(this).find('#email').css("border", "1px solid rgb(169, 169, 169)");
  }

else if

надо без else, тогда оба условия будут проверяться независимо.

if ($('#name').val().length >= 3) {
    $(this).find('#name').css("border", "1px solid rgb(169, 169, 169)");
}
if ($('#email').val().length > 10 && $('#email').val().search(pattern) == 0) {
    $(this).find('#email').css("border", "1px solid rgb(169, 169, 169)");
}

и т.д.

Comments

[Genri_Rus]

Спасибо, а вот насчет оптимизации как ?

Допустим .css("border", "1px solid rgb(169, 169, 169)") - это можно как-то сократить, чтобы много раз не повторять ?

[alex-1917]

Genri_Rus,
1px solid rgb(169, 169, 169)
1px solid #A9A9A9

var c = '1px solid #A9A9A9';
.css("border", c)

[Genri_Rus]

alex-1917, понятно

Только если через переменную

[Genri_Rus]

А как теперь после всех проверок AJAX отправить ?

https://codepen.io/Genri_Rus/pen/YzzzNMY

[Сергей c0re]

Genri_Rus, Лучше сделать через класс, который определять в стилях CSS
а в скрипте переключать классы
jquery toggle class

кроме того, так быстрее изменить и применяемые стили, они все в одном месте в CSS, не надо искать по коду, вникать.

А как теперь после всех проверок AJAX отправить ?

это уже другой вопрос ))
смотрите гугл, примеры есть: jquery ajax example