Yakuza

Yakuza

WFN Üye
Konular
577
Mesajlar
577
Çözüm
0
Ticaret Puanı
0
Üyelik
24 Gün
Konum
Artvin
Web Sitesi
Var
Alanı
SEO Danışmanı
1/1
Konu sahibi
İlk paragrafta ana yanıtı, izlenecek yolu ve ulaşılabilecek sonucu doğrudan ver. Konunun önemini öven genel açılış veya bu makalede anlatacağız vaadiyle başlama. Okuru asıl bilgiye ulaşmak için gereksiz paragraflar okumaya zorlama.

HTML’de form alanını zorunlu yapmak​


Bir form alanının boş bırakılmasını engellemek için ilgili HTML öğesine required özniteliğini ekleyin. Bu öznitelik input, select ve textarea öğelerinde kullanılabilir. Kullanıcı alanı doldurmadan formu göndermeyi denediğinde tarayıcı gönderimi durdurur ve alanın tamamlanması gerektiğini belirtir.

HTML: 
<form action="/kayit" method="post">
    <label for="ad">Adınız</label>
    <input type="text" id="ad" name="ad" required>

    <label for="eposta">E-posta adresiniz</label>
    <input type="email" id="eposta" name="eposta" required>

    <button type="submit">Gönder</button>
</form>

Burada hem ad hem de eposta alanı zorunludur. Kullanıcı bu alanlardan birini boş bırakarak Gönder düğmesine bastığında form normal şekilde gönderilmez. Tarayıcı, boş kalan zorunlu alanı işaretleyerek önce bu alanın doldurulmasını ister.

Farklı form öğelerinde kullanım​


Metin, e-posta, parola, tarih ve benzeri girişlerde required doğrudan input etiketine eklenir. textarea için de aynı kullanım geçerlidir:

HTML: 
<label for="mesaj">Mesajınız</label>
<textarea id="mesaj" name="mesaj" required></textarea>

Seçim kutusunda kullanıcıdan gerçek bir seçenek seçmesini istiyorsanız, ilk seçeneği boş değerle birlikte kullanabilirsiniz:

HTML: 
<label for="sehir">Şehir</label>
<select id="sehir" name="sehir" required>
    <option value="">Seçiniz</option>
    <option value="istanbul">İstanbul</option>
    <option value="ankara">Ankara</option>
    <option value="izmir">İzmir</option>
</select>

Kullanıcı Seçiniz seçeneğinde bırakırsa alan geçerli kabul edilmez. Geçerli bir seçeneğin value değeri boş olmamalıdır; aksi durumda tarayıcı, seçimin yapıldığını sanabilir.

Radyo düğmelerinde aynı seçenek grubundaki en az bir seçeneği zorunlu yapmak için gruptaki uygun input öğelerine required eklenebilir:

HTML: 
<p>Üyelik türü</p>
<label><input type="radio" name="uyelik" value="bireysel" required> Bireysel</label>
<label><input type="radio" name="uyelik" value="kurumsal"> Kurumsal</label>

Aynı name değerine sahip bu düğmeler tek grup olarak değerlendirilir. İlk seçenekteki required, kullanıcıdan bu gruptan bir seçim yapılmasını istemek için yeterlidir. Kullanıcının iki seçeneği birden işaretlemesi gereken onay kutusu gruplarında ise her kutuya ayrı required eklemek yerine, her koşulu uygulamanızın gereksinimine göre ayrıca kontrol etmelisiniz.

Zorunlu alan ile biçim doğrulamasını ayırın​


required yalnızca alanın boş olmamasını sağlar. Alanın belirli bir biçimde olmasını istiyorsanız uygun türü veya ek doğrulama özniteliklerini de kullanmalısınız.

HTML: 
<input type="email" name="eposta" required>
<input type="password" name="parola" minlength="8" required>
<input type="text" name="kullanici_adi" pattern="[A-Za-z0-9_]+" required>

İlk alan boş bırakılamaz ve tarayıcı tarafından e-posta biçimi açısından denetlenir. İkinci alan boş bırakılamaz ve en az sekiz karakter içermelidir. Üçüncü alan ise boş bırakılamaz ve pattern ile belirtilen karakter yapısına uymalıdır.

Zorunlu alan doğrulaması yalnızca tarayıcı tarafındaki ilk kontroldür. Kullanıcı JavaScript'i kapatabilir, farklı bir istemci kullanabilir veya HTTP isteğini doğrudan gönderebilir. Bu nedenle sunucuya gelen verileri ayrıca kontrol etmeli, boş veya geçersiz değerleri kabul etmemelisiniz. required kullanıcıya hızlı geri bildirim verir; sunucu tarafı doğrulamanın yerine geçmez.

Sonucu kontrol ederken dikkat edilmesi gerekenler​


Form gönderildiğinde zorunlu alan uyarısı çıkıyorsa bu, alanın boş bırakıldığı veya tarayıcının değeri geçerli kabul etmediği anlamına gelir. Örneğin type="email" kullanılan bir alana yalnızca metin yazılması, alan boş olmasa bile biçim doğrulamasını geçemeyebilir. Kullanıcıdan geçerli biçimde veri girmesini istemeli ve sunucuda da aynı değeri yeniden doğrulamalısınız.

disabled özniteliği verilmiş bir alan form gönderimine dahil edilmez ve zorunlu alan olarak çalışmaz. Alanın kullanıcı tarafından değiştirilmesini istemiyor ancak değerinin gönderilmesini istiyorsanız readonly kullanılabilir; ancak readonly her alan türünde desteklenmez ve sunucunun gelen değere güveneceği anlamına gelmez.

Formda novalidate kullanılırsa tarayıcının yerleşik doğrulaması devre dışı bırakılır:

HTML: 
<form action="/kayit" method="post" novalidate>

Bu durumda required özniteliği HTML içinde bulunmaya devam eder, fakat tarayıcı formu gönderirken yerleşik zorunlu alan kontrolünü uygulamaz. Böyle bir kullanım ancak doğrulamayı JavaScript veya sunucu tarafında kendiniz yapıyorsanız anlamlıdır. Normal bir formda novalidate eklemeyin; aksi hâlde kullanıcı boş alan uyarısını tarayıcıdan alamaz.

Formu uygularken her zorunlu alan için required ekleyin, boş başlangıç seçeneğinin value değerini boş bırakın ve formu göndererek tarayıcının alanı işaretleyip işaretlemediğini kontrol edin. Ardından sunucuda gelen değerleri yeniden doğrulayın; tarayıcıda görülen başarılı sonuç, verinin güvenilir veya iş kurallarınıza uygun olduğunu tek başına kanıtlamaz.
 

Sende şimdi bize katılmak ister misin?

Kayıt ol

Bize katılım kolay ve ücretsizdir!

Üye ol
Foruma git ?

Bu konuyu görüntüleyen kullanıcılar

Bu konuyu şu anda görüntüleyen üye bulunmuyor.
Robotlar:
  • Anthropic
Toplam: 1 (Üye: 0, misafir: 0, robot: 1)