Meydan okuma - Doğrulamalı form
Tüm doğrulama öznitelikleriyle bir rezervasyon formu yazarsın.
Form doğrulama araçları
HTML, sunucuya gitmeden önce formu doğrular. required boş bırakılmayı engeller; pattern düzenli ifadeyle biçim şartlar; min, max ve step sayısal aralığı denetler.
Metin uzunluğu için minlength ve maxlength kullanılır. <fieldset> ve <legend> grupları etiketler; <label for> ile id eşleşmesi erişilebilirliği artırır.
Uygulama Rezervasyon formu yaz
Bir otel rezervasyon formu yaz. <fieldset> ve <legend> ile grupla. Her alana <label for> ve eşleşen id koy. required, pattern, min, max ve maxlength kullan. type="submit" bir düğme ekle.
Örnek çözümü göster
<form>
<fieldset>
<legend>Rezervasyon bilgileri</legend>
<label for="ad">Ad Soyad</label>
<input type="text" id="ad" name="ad" required maxlength="60">
<label for="tarih">Giriş tarihi</label>
<input type="date" id="tarih" name="tarih" required min="2026-01-01" max="2026-12-31">
<label for="tel">Telefon</label>
<input type="tel" id="tel" name="tel" required pattern="[0-9]{3} [0-9]{3} [0-9]{4}">
</fieldset>
<button type="submit">Rezerve et</button>
</form>Kendini test et
-
Telefon deseni
<input type="tel" ____ name="tel" required>Cevabı göster
<input type="tel" pattern="[0-9]{3} [0-9]{3} [0-9]{4}" name="tel" required> -
Bir alanın boş bırakılmasını engellemek için hangi öznitelik?
- placeholder
- pattern
- required
- optional
Cevabı göster
required — Doğru. required, alanın doldurulmasını zorunlu kılar.
-
Doğrulama öznitelikleri
- required
- doldurulmalı
- pattern
- düzenli ifade
- min
- en küçük değer
- maxlength
- en fazla karakter