Walidacja email JS

Question

Mam problem z implementacja jednej funkcji do mojejgo skryptu walidacji 

fragment kodu

var $name = $('#name');
var $email = $('#email');
var $msg = $('#msg');


$('form span').hide();


function nameVal() {
  return $name.val().length > 1;
}

function emailVal() {
   return $email.val().length >= 8;
}

function msgVal() {
  return $msg.val().length > 1;
}

function sendAllow() {
  return nameVal() && emailVal(email) && msgVal();
}


function nameSpan() {
  if(nameVal()) {
    $name.next().hide();
  } else {
    $name.next().show();
  }
}

function emailSpan() {
  if(emailVal()) {
    $email.next().hide();
  } else {
    $email.next().show();
  }
}

function msgSpan() {
  if(msgVal()) {
    $msg.next().hide();
  } else {
    $msg.next().show();
  }
}

function isDisabled() {
  $('#submit').prop('disabled', !sendAllow());
}

function buttonReady() {
  if(sendAllow()) {
    $('#submit').removeClass('wylaczony');
  } else {
    $('#submit').addClass('wylaczony');
  }
}


$name.keyup(nameSpan).keyup(isDisabled).keyup(buttonReady);
$email.keyup(emailSpan).keyup(isDisabled).keyup(buttonReady);
$msg.keyup(msgSpan).keyup(isDisabled).keyup(buttonReady);

isDisabled();

 

No a chce zamiast emailVal wrzucić tą funkcje

function emailVal(email) {
    var re = /^([\w-]+(?:\.[\w-]+)*)@((?:[\w-]+\.)*\w[\w-]{0,66})\.([a-z]{2,6}(?:\.[a-z]{2})?)$/i;
    return re.test(email);
}

 

Tylko cos mam problem ze spanem i funkcja SendAllow

 

Answer 1

Zacznijmy od tego, że niekoniecznie ten regex dobrze waliduje maile (np. nie przepuści polskich znaków).

Co do problemu - co znaczy "mam problem"? Konsola coś rzuca? Mógłbyś przygotować przykład na jsfiddle?

Comments

Problem widze po tym ze mimo kilku modyfikacji ani moj span nie znika ani button nie zostaje odblokowany czyli nie jest spelniony ten warunek.
Do tego nie rozumiem return re.test(email);

na jsfiddle chyba to nie dziala przez to że span jest sprawdzany przez .keyup()

---

A dołączyłeś na jsfiddle jQuery?

Do tego nie rozumiem return re.test(email); 

re to wyrażenie regularne. re.test to metoda, która sprawdza czy podany jej string pasuje do wzorca. Zamiast email powinieneś podstawić $email.val()

Co do keyup - w teorii powinieneś używać input: https://mathiasbynens.be/notes/oninput

No i zamiast przypinać 3 razy oddzielnie można przypiąć raz funkcję anonimową, która odpali całość.

Ostatecznie wychodzi coś takiego: http://jsfiddle.net/Comandeer/y3s9m6r7/ 

nameSpan, emailSpan i msgSpan są bardzo podobne - może warto z nich zrobić funkcję uniwersalną?

---

Dzieki, odpocznie i to ogarne, i dam znać w temacie.

---

"No i zamiast przypinać 3 razy oddzielnie można przypiąć raz funkcję anonimową, która odpali całość." 

Ale w Twoim kodzie z .on też jest podpiete oddzielnie.

Co do jednej funkcji dla 'span' to chyba i tak bede musial sie odniesc do tych 3 funckji 

 

---

Ale w Twoim kodzie z .on też jest podpiete oddzielnie.

Chodziło mi to, że Ty dla jednego pola wywoływałeś kilka razy keyup, natomiast u mnie jest tylko jedno on 

---

To sie zgadza, a co to zastapienia tamtych trzech identycznych funkcji jedną nic nie wymysliłem. Jak tu sie odwołać z if dla trzech rożnych zmiennych, no bo dalej to pewnie cos w stylu

$(this).next().show()

 

---

Szedłbym w coś takiego: http://jsfiddle.net/Comandeer/y3s9m6r7/1/

IMO bardziej rozwijalne na przyszłość

---

Rano do tego usiąde bo widze ze kod sie skomplikował :)