Html formlarında düzenli ifadeler

Sezai AlkanFrontend Developer

HTML #regex #form #html

HTML formlarında Düzenli ifadeler REGEX ile forma girilen veriyi filtreleyebiliriz. Belirdeğimiz ifadeye göre kullanıcından veri girişini sınırlayabiliriz belirlediğimiz kurallar dışında bir veri girişi sağlamaya çalışır ise uyarı oluşturabiliriz.

HTML formlarında düzenli ifadelerimizi pattern attribute ne giriyoruz. Belirlediğimiz ifade dışında veri girişi sağlanır ise title attribute ile kullanıcıya uyarı verebilmekteyiz.

<form method="post">
    <input type="text" pattern="[0-9]" title="0 - 9 Arasındaki Sayılar Geçerlidir" name="" required>
    <input type="submit" name="">
</form>

Yukarıdaki oluşturduğumuz örnekte Textbox a sadece 0 ile 9 arasında sayı girilebileceği bir ifade oluşturduk eğer 0 ın altında veya 9 un üzerinde bir sayı girilmeye çalışılır ise Kullanıcıya title ın içerisindeki uyarı verilecektir.

Dilersek bu sayı uzunluğunu arttırabilmekteyiz. Oluşturduğumu ifade sonrasında Süslü parantezler içerisinde sayı veya değer uzunluğunu belirtebiliriz. Örn : [0-9]{9}

<form method="post">
    <input type="text" pattern="(05)[0-9]{9}$" title="05355555555 formatında telefonunuzu girmeniz gereklidir." name="" required>
    <input type="submit" name="">
</form>

Yukarıkida örnekte ise 05 ile başlayan ve devamında girilecek numaranın en fazla 9 basamaklı olacağı ifadesini oluşturmaktayız. Eğer belirtilen format haricinde bir veri girilmeye çalışılır ise kullanıcıya belirlediğimi uyarı verilecektir.