Vlastné overovacie vzory pre textové polia

A textové pole akceptuje čokoľvek, čo používatelia zadajú – niekedy však potrebujete špecifické formáty. URL adresy webových stránok, kódy produktov, čísla licencií alebo názvy pozostávajúce iba z písmen majú vzory, vďaka ktorým sú platné. Vlastné overovacie vzory vám umožňujú presne definovať, aký formát je prijateľný, a zachytiť chyby pred odoslaním.

V tejto príručke sa naučíte, ako pridať vlastné overovacie vzory do textových polí vo formulároch WordPress.

Čo sú to validačné vzory?

Koncept

Validačné vzory sú pravidlá, ktoré definujú, ktorý vstup je platný:

• „Musí obsahovať iba písmená“
• „Musí to byť platná URL adresa“
• „Musí zodpovedať formátu ABC-1234“
• „Musí mať presne 10 znakov“

Ako fungujú

1. Používateľ píše do textového poľa
2. Pri odoslaní (alebo počas písania) sa vstup kontroluje podľa vzoru
3. Ak sa zhoduje: Overenie prebehlo úspešne
4. Ak sa tak nestane: Zobrazí sa chybové hlásenie

Výhody

• Kvalita dát: Zabezpečte konzistentné formáty
• Predchádzanie chybám: Včas odhaliť chyby
• Návod pre užívateľa: Jasné očakávania
• Kompatibilita s následným spracovaním: Dáta spolupracujú s inými systémami

Vstavané overovacie vzory

Automatický tvorca formulárov zahŕňa bežné vzorce:

Používanie vstavaných vzorov

Krok 1: Pridanie textového poľa

1. Otvorte formulár v A.F.B.
2. Ťahať text pole na vytvorenie
3. Kliknite pre konfiguráciu

Krok 2: Vyberte overovací vzor

1. nájsť Overovací vzor v nastaveniach
2. Vyberte z rozbaľovacej ponuky:
   • Žiadne (bez vzoru)
   • E-mail
   • URL
   • Iba písmená
   • Iba čísla
   • alfanumerický
   • zvyk
3. Uložiť nastavenia

Krok 3: Overenie testu

1. Náhľad formulára
2. Skúste platný vstup – malo by to prebehnúť
3. Skúste neplatný vstup – mala by sa zobraziť chyba

Príklady vzorov a prípady použitia

Overenie adresy URL

Použiť pre:

• Pole webovej stránky
• Odkazy na portfólio
• Profily sociálnych médií
• Referenčné adresy URL

Platné príklady:

• https://example.com
• http://www.example.com/page
• https://example.com/path?query=value

Neplatné príklady:

• example.com (chýbajúci protokol)
• www.example.com (chýba protokol)
• len nejaký text

Iba písmená

Použiť pre:

• Meno/priezvisko (jednoduché overenie)
• Názvy miest
• Kódy krajín
• Abecedne identifikátory

Platné príklady:

• Ján
• Kováč
• Newyork

Neplatné príklady:

• John123
• New York (vesmír)
• O'Brien (apostrof)

Poznámka: Používanie iba písmen je prísne. Zvážte, či potrebujete medzery, pomlčky alebo diakritiku.

Iba čísla

Použiť pre:

• identifikačné čísla
• Čísla účtov
• Množstvo (ak sa nepoužíva číselné pole)
• PIN kódy

Platné príklady:

• 12345
• 00123
• 9876543210

Neplatné príklady:

• 123-456 (pomlčka)
• 123.45 (desatinné)
• 12345

alfanumerický

Použiť pre:

• Kódy výrobkov
• Referenčné čísla
• používateľské mená
• Sériové čísla

Platné príklady:

• ABC123
• User42
• PROD001

Neplatné príklady:

• ABC-123 (pomlčka)
• ABC 123 (medzera)
• ABC_123 (podčiarknuté)

Vlastné overovacie vzory (Regex)

Čo je Regex?

Regulárne výrazy (regex) sú vzory, ktoré opisujú textové formáty:

• ^ = Začiatok reťazca
• $ = Koniec reťazca
• [A-Z] = Ľubovoľné veľké písmeno
• [a-z] = Ľubovoľné malé písmeno
• [0-9] = Ľubovoľná číslica
• {3} = Presne 3 z predchádzajúcich
• {2,5} = Medzi 2 a 5 predchádzajúcimi
• + = Jeden alebo viac
• * = Nula alebo viac
• ? = Voliteľné (nula alebo jeden)

Vytváranie vlastných vzorov

1. V rozbaľovacej ponuke overenia vyberte možnosť „Vlastné“
2. Zadajte svoj regulárny výraz
3. Test s rôznymi vstupmi

Príklady bežných vlastných vzorov

PSČ USA

vzor: ^\d{5}(-\d{4})?$

Overuje:

• 12345 (5 číslic)
• 12345-6789 (PSČ+4)

Odmietnuté:

• 1234 (príliš krátke)
• 123456 (príliš dlhé)
• ABCDE (písmena)

Telefónne číslo v USA

vzor: ^\d{3}-\d{3}-\d{4}$

Overuje: 555-123-4567

Pre flexibilný formát: ^\(?\d{3}\)?[-.\s]?\d{3}[-.\s]?\d{4}$

Overuje:

• 555-123-4567
• (555) 123-4567
• 555.123.4567
• 555 123 4567

Kód produktu (formát ABC-1234)

vzor: ^[A-Z]{3}-\d{4}$

Overuje:

• ABC-1234
• XYZ-9999
• PRO-0001

Odmietnuté:

• abc-1234 (malé písmená)
• AB-1234 (iba 2 písmená)
• ABC1234 (chýba pomlčka)

ŠPZ (rôzne formáty)

Vzor (všeobecný pre USA): ^[A-Z0-9]{1,7}$

Overuje: 1-7 veľkých písmen/číslic

Kreditná karta (základný formát)

vzor: ^\d{4}[\s-]?\d{4}[\s-]?\d{4}[\s-]?\d{4}$

Overuje:

• 1234567890123456
• 1234 5678 9012 3456
• 1234-5678 9012 - 3456

Poznámka: Pre skutočné platby použite správnych spracovateľov platieb s ich overením.

Používateľské meno (písmena, čísla, podčiarkovník)

vzor: ^[a-zA-Z][a-zA-Z0-9_]{2,19}$

Pravidlá:

• Začína sa písmenom
• Celkom 3 – 20 znakov
• Iba písmená, čísla, podčiarkovník

Overuje: user_123, JohnDoe, test42

Hexadecimálny farebný kód

vzor: ^#([A-Fa-f0-9]{6}|[A-Fa-f0-9]{3})$

Overuje:

• #FF5733
• #fff
• #ABC123

Dátum (RRRR-MM-DD)

vzor: ^\d{4}-\d{2}-\d{2}$

Overuje: 2026-01-15

Poznámka: Pre dátumy je zvyčajne lepšie použiť pole Dátum s výberom dátumu.

Čas (HH:MM 24-hodinový)

vzor: ^([01]\d|2[0-3]):[0-5]\d$

Overuje:

• 09:30
• 14:45
• 23:59

Číslo faktúry (INV-RRRR-NNNN)

vzor: ^INV-\d{4}-\d{4}$

Overuje:

• INV-2026-0001
• INV-2025-1234

Číslo sociálneho zabezpečenia (USA)

vzor: ^\d{3}-\d{2}-\d{4}$

Overuje: 123-45-6789

Upozornenie: Pri zhromažďovaní rodných čísel buďte opatrní – majú to vplyv na bezpečnosť a súkromie.

Vytváranie vlastných vzorov

Proces krok za krokom

1. Definujte požiadavky: Aký formát potrebujete?
2. Rozober to: Aké postavy, koľko, v akom poradí?
3. Vzor zostavenia: Preložiť do regulárneho výrazu
4. Dôkladne otestujte: Platné A neplatné vstupy
5. Napísať chybovú správu: Pomôžte používateľom pochopiť formát

Príklad: ID zamestnanca

požiadavka: 2 písmená + 4 číslice + 1 písmeno (napr. AB1234C)

Zlomiť:

• 2 veľké písmená: [A-Z]{2}
• 4 číslic: \d{4}
• 1 veľké písmeno: [A-Z]
• Nič predtým ani potom: ^ a $

Konečný vzor: ^[A-Z]{2}\d{4}[A-Z]$

Testovacie vzory

Pred použitím vo forme:

• Otestujte platné vstupy (malo by to byť úspešné)
• Otestujte neplatné vstupy (malo by zlyhať)
• Testovanie okrajových prípadov (hranice, špeciálne znaky)
• Na ladenie použite online testery regulárnych výrazov

Chybové hlásenia pre overenie

Predvolené správy

• „Zadajte platnú hodnotu“
• „Toto pole je neplatné“

Lepšie prispôsobené správy

Oznámte používateľom očakávaný formát:

Používanie zástupného symbolu a textu pomoci

Predíďte chybám zobrazením formátu vopred:

• Zástupný symbol: „ABC-1234“
• Pomocný text: „Zadajte kód produktu (napr. ABC-1234)“

Osvedčené postupy

1. Začnite jednoducho

Vždy, keď je to možné, používajte vstavané vzory. Vlastné regulárne výrazy zvyšujú zložitosť.

2. Nepreceňujte overovanie

Príliš prísne vzory frustrujú používateľov:

• Mená s pomlčkami (Mary-Jane)
• Mená s apostrofmi (O'Brien)
• Medzinárodné postavy (José, Müller)

3. Zobraziť očakávaný formát

Vždy povedzte používateľom, čo očakávate:

• Zástupný symbol s príkladom
• Pomocný text vysvetľujúci formát
• Vymazať chybové hlásenie

4. Testovanie okrajových prípadov

• Prázdny vstup
• Medzery na začiatku/konci
• Špeciálne znaky
• Maximálna dĺžka

5. Zvážte alternatívy

Niekedy sú lepšie iné prístupy:

• Dátumy → Použiť pole Dátum
• Čísla → Použiť pole Číslo
• Telefón → Použiť pole Telefón s formátom
• Pevné možnosti → Použiť rozbaľovaciu ponuku

Kombinácia s inou validáciou

Vzor + Povinné

• Pole musí byť vyplnené A musí zodpovedať vzoru
• Prázdne zlyhá „povinné“
• Nesprávny formát zlyhal vzorom

Vzor + Min/Max dĺžka

• Vzor overuje formát
• Dĺžka potvrdzuje veľkosť
• Obaja musia prejsť

Riešenie problémov s vzormi

Vzor nefunguje

kontrola:

• Syntax je správna (bez preklepov)
• Špeciálne znaky boli správne uniknuté
• kotvy ^ a $, ak je to potrebné

Platný vstup sa odmieta

kontrola:

• Vzor môže byť príliš prísny
• Chýbajúce platné znaky vo vzore
• Problémy s rozlišovaním veľkých a malých písmen

Prijíma sa neplatný vstup

kontrola:

• Vzor môže byť príliš voľný
• Chýbajúce kotvy (^ a $)
• Otestujte s ďalšími príkladmi

Často kladené otázky

Môžem kombinovať viacero vzorov?

Jedno pole používa jeden vzor. Pre komplexné overovanie skombinujte požiadavky v jednom regulárnom výraze pomocou striedania (|) alebo vytvorte vzor, ​​ktorý bude zodpovedať všetkým požiadavkám.

Rozlišujú vzory malé a veľké písmená?

Predvolene áno. Na zhodu oboch veľkých a malých písmen použite [A-Za-z] alebo pridajte príznak nerozlišovania veľkých a malých písmen, ak je podporovaný.

Ako povoľujem medzery?

Pridajte \ do svojej triedy znakov: [A-Za-z\s] zodpovedá písmenám a medzerám.

A čo medzinárodné znaky?

Štandardné písmená [A-Za-z] neobsahujú znaky s diakritikou. Pre medzinárodné názvy zvážte voľnejšiu validáciu alebo použite \p{L} (ak je podporované) pre ľubovoľné písmeno.

Mám overiť na Blur alebo odoslať?

Obe fungujú. Pri rozmazaní (strate zaostrenia) poskytuje rýchlejšiu spätnú väzbu. Pri odoslaní zachytáva všetko. Mnoho formulárov robí oboje.

zhrnutie

Pridanie vlastných overovacích vzorov:

1. Vyberte typ vzoru – Vstavané alebo na mieru
2. Konfigurovať vzor – Vyberte alebo zadajte regulárny výraz
3. Pridať zástupný symbol – Zobraziť očakávaný formát
4. Pridať text pomoci – Vysvetlite požiadavky
5. Nastaviť chybové hlásenie – Korekcia sprievodcu
6. Dôkladne otestujte – Platné a neplatné vstupy

Záver

Vlastné overovacie vzory zabezpečujú kvalitu údajov vynucovaním špecifických formátov. Či už potrebujete overenie URL adresy, kódov produktov alebo vlastných identifikátorov, vzory zachytia chyby pred odoslaním a navedú používateľov na opravu vstupu.

Automatický tvorca formulárov zahŕňa bežné vzory (e-mail, URL, písmená, čísla, alfanumerické znaky) a podporuje vlastné regulárne výrazy pre špecializované potreby overovania. Čisté dáta začínajú správnym overovaním.

Ste pripravení overiť vstupy do formulára? Stiahnite si automatický nástroj na tvorbu formulárov a zabezpečte, aby vaše formuláre zhromažďovali správne formátované údaje.