Atrybut pattern

Atrybut pattern ustawia walidację pola formularza HTML formularza za pomocą wyrażenia regularnego.

Wyrażenia regularne to specjalne komendy, które pozwalają tworzyć praktycznie dowolne reguły walidacji. Szczegółowo można się z nimi zapoznać w książce dotyczącej wyrażeń regularnych PHP lub w książce dotyczącej wyrażeń regularnych JavaScript.

Przy próbie wysłania formularza, jeśli pole z tym atrybutem nie jest wypełnione - przeglądarka nie pozwoli na wysłanie formularza i wyświetli błąd w formie dymka. Niestety, tekst błędu i jego wyglądu nie można zmienić za pomocą HTML lub CSS.

Miej na uwadze, że obecność atrybutu pattern nie zwalnia Cię z weryfikacji poprawności wypełnienia formularza po stronie serwera na PHP (ponieważ zabezpieczenie przez atrybut łatwo obejść).

Atrybut pattern należy stosować do znaczników input lub textarea.

Przykład

Odnijmy się do znacznika input i dodajmy atrybut pattern, do którego wprowadzimy wyrażenie regularne sprawdzające, czy w inpucie wprowadzono liczbę składającą się z dwóch cyfr (na przykład 25).

Wprowadź dowolną liczbę i spróbuj nacisnąć przycisk, aby wysłać formularz. Jeśli wprowadzona liczba nie składa się z dwóch cyfr, przeglądarka nie pozwoli na wysłanie formularza i wyświetli komunikat o błędzie, w przeciwnym razie formularz zostanie wysłany:

html<form action="">
  <input type="text" pattern="\d{2}">
  <input type="submit">
</form>

Результат:

Przykład . Puste pole

W poprzednim przykładzie przeglądarka wyświetlała błąd tylko wtedy, gdy pole nie było puste (chociaż puste pole nie jest liczbą z dwoma cyframi). Spróbujmy sprawić, aby błąd był wyświetlany również dla pustego pola - razem z atrybutem pattern dodajmy również atrybut required:

html<form action="">
  <input type="text" pattern="\d{2}" required>
  <input type="submit">
</form>

Результат:

Zobacz też