• Najnowsze pytania
  • Bez odpowiedzi
  • Zadaj pytanie
  • Kategorie
  • Tagi
  • Zdobyte punkty
  • Ekipa ninja
  • IRC
  • FAQ
  • Regulamin
  • Książki warte uwagi

Walidacja numeru telefonu

Aruba Cloud - Virtual Private Server VPS
0 głosów
2,407 wizyt
pytanie zadane 28 maja 2020 w JavaScript przez DobryKurczak Bywalec (2,320 p.)

Witam.

Mam za zadanie zrobić w js funkcję, która będzie mi sprawdzać, czy numer telefonu wpisany do inputa jest poprawny, jeśli nie to wyskoczy komunikat, np jak zamiast liczby wstawię znak to powinien pojawić się komunikat "tylko cyfry", jeśli za dużo liczb (więcej niż 9) to komunikat że za dużo cyfr itp.

Mój problem polega na tym, że napisałem funkcję i nie wyrzuca ona poprawnie komunikatów. To znaczy jak dam 9 cyfr to nie pojawia się komunikat "Good".

Tu mój kod w js:

(function () {
  const ex2_t=document.querySelector('input')
  const ex2_c = document.getElementById('ex2_content')

  
  ex2_t.addEventListener('input', testInfo);
  const re = /^\d{9}$/;
  console.log(re.test(177727538));
      function testInfo(e)
      {
        if (!re.test(e))
        {
          ex2_c.textContent=e.target.value;
        }
        else{
          ex2_c.innerHTML="Good!";
        }
      }
 })();

W HTML wygląda to tak:

      <div id="ex2" class="ex">
        <h5>Ex2 - Validation</h5>
        <input type="text" id="ex2_text" placeholder="phone number" />
        <div id="ex2_content"></div>
      </div>

Sprawdziłem też czy moje wyrażenie jest poprawne i w konsoli wyskakuje true, więc jest ok, więc może nie porównuje tego czego ja chcę, ale już nie mam pojęcia :( Z góry dziękuję za pomoc!

2 odpowiedzi

+1 głos
odpowiedź 28 maja 2020 przez ScriptyChris Mędrzec (190,190 p.)

W ifie z 11 linii testujesz RegExp'em obiekt zdarzenia, a powinieneś testować wartość jego elementu (e.target.value), którą stanowi wprowadzony numer telefonu - tą akurat przypisujesz w 13 linii.

Do procesowania numeru telefonu lepiej użyć <input type="tel">, który oferuje wbudowaną walidację ułatwia jego walidację i oferuje atrybuty konfiguracyjne dla wprowadzanego numeru telefonu.

0 głosów
odpowiedź 28 maja 2020 przez DobryKurczak Bywalec (2,320 p.)
Dobra. Teraz działa wielkie dzięki! A jeszcze ostatnie pytanie mam. Bo chcę zrobić taką walidację, że jeśli w przypadku wprowadzenia znaku pojawi się komunikat "Numer telefonu nie może posiadać liter", jeśli wprowadzę za krótki lub za długi numer to pojawi się komunikat "Nieodpowiednia długość!" itp. To czy są już jakieś wbudowane funkcje, które to sprawdzają, czy trzeba kombinować "ręcznie"?
komentarz 28 maja 2020 przez ScriptyChris Mędrzec (190,190 p.)

W dokumentacji do tego inputa są zawarte atrybuty służące do walidacji. Możesz ustawić m.in. minimalną i maksymalną liczbę znaków oraz własny pattern RegExp'owy. Wynik walidacji możesz odczytać z property validity inputa (e.target.validity) i na tej podstawie wyświetlać odpowiedni komunikat.

Podobne pytania

0 głosów
1 odpowiedź 2,833 wizyt
pytanie zadane 21 października 2018 w JavaScript przez DinapeS Początkujący (350 p.)
+1 głos
0 odpowiedzi 608 wizyt
0 głosów
2 odpowiedzi 4,347 wizyt
pytanie zadane 31 października 2016 w PHP przez ThePatrykOOO Dyskutant (8,400 p.)

93,324 zapytań

142,323 odpowiedzi

322,389 komentarzy

62,652 pasjonatów

Motyw:

Akcja Pajacyk

Pajacyk od wielu lat dożywia dzieci. Pomóż klikając w zielony brzuszek na stronie. Dziękujemy! ♡

Oto polecana książka warta uwagi.
Pełną listę książek znajdziesz tutaj

Wprowadzenie do ITsec, tom 1 Wprowadzenie do ITsec, tom 2

Można już zamawiać dwa tomy książek o ITsec pt. "Wprowadzenie do bezpieczeństwa IT" - mamy dla Was kod: pasja (użyjcie go w koszyku), dzięki któremu uzyskamy aż 15% zniżki! Dziękujemy ekipie Sekuraka za fajny rabat dla naszej Społeczności!

...