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

Sıradaki ders: Meydan okuma - Anlamsal düzen

Deneyiminizi Geliştiriyoruz

Çerez Tercihleri

Kesinlikle Gerekli Çerezler

Analitik Çerezler