CodeBlanks Logo Icon CodeBlanks

Novalidate ve formnovalidate

HTML kursu · Orta seviye · Ders 39/67

Doğrulamayı devre dışı bırakmayı öğrenirsin.

novalidate ile doğrulamayı kapat

Bazen bir formu doğrulama olmadan göndermen gerekir; örneğin hatalı veriyi taslak olarak kaydetmek isteyebilirsin. <form> etiketine novalidate özniteliğini eklersen tarayıcı, tüm doğrulama koşullarını görmezden gelir ve formu olduğu gibi gönderir. required, pattern, type=email gibi koşulların hiçbiri uygulanmaz. Bu özniteliğin bir değeri yoktur; varlığı yeter.

formnovalidate ile tek butonu atlama

Bazen tek bir butonun doğrulamayı atlamasını istersin; örneğin Taslak kaydet butonu doğrulama olmadan göndersin, ama asıl Gönder butonu doğrulama yapsın. İşte formnovalidate bir <button>'a konur ve yalnızca o butona basıldığında doğrulama atlanır. novalidate tüm formu kapatırken, formnovalidate yalnızca bir butonu hedefler. Böylece aynı formda iki farklı gönderme davranışı tanımlayabilirsin.

Uygulama Forma novalidate ve taslak butonu ekle

Aşağıdaki formu tamamla:

  • <form> etiketine novalidate ekle
  • İçine bir gönder butonu koy (type="submit")
  • İkinci bir Taslak kaydet butonu ekle; bu buton formnovalidate taşısın

İki buton da bir metin içersin.

Örnek çözümü göster
<form action="/kayit" method="post" novalidate>
  <button type="submit">Gönder</button>
  <button type="submit" formnovalidate>Taslak kaydet</button>
</form>

Kendini test et

  1. formnovalidate özniteliği hangi etikete konur?

    • button
    • form
    • input type=text
    • label
    Cevabı göster

    button — Doğru. formnovalidate bir butona konur ve yalnızca o butona basıldığında doğrulamayı atlar.

  2. Formun doğrulamasını kapat

    <form action="/kayit" method="post" ____>
      <button type="submit">Gönder</button>
    </form>
    Cevabı göster
    <form action="/kayit" method="post" novalidate>
      <button type="submit">Gönder</button>
    </form>
  3. Özniteliği uygulandığı yere eşleştir

    novalidate
    form etiketinde
    formnovalidate
    button etiketinde
    required
    input etiketinde
    pattern
    input'ta (text/password)

Orta seviye bölümündeki tüm dersler