HTML Form Öznitelikleri
Formlar iskeleti verdi. Form öznitelikleri davranışı inceler — boş action, get vs post, otomatik doldurma, kontroller, form’un kendisini adlandırma. Input türleri ve form= sonra.
Form öznitelikleri neden önemli
İki benzer form farklı davranabilir. form üzerindeki öznitelikler yeni alan olmadan hedefi, HTTP stilini, otomatik doldurmayı ve doğrulamayı değiştirir.
Doğrudan yanıt
1) action + method. 2) boş action → geçerli sayfa. 3) autocomplete. 4) novalidate yalnızca bilerek. 5) form id/name betikler için.
📊 Form attributes at a glance
| Attribute | Role | Beginner tip |
|---|---|---|
| action | Where the browser sends the data | Empty often means “this page” |
| method | get (query string) or post (request body) | Prefer post for private or large data |
| autocomplete | Autofill hint for the form | off for sensitive practice forms |
| novalidate | Skip built-in HTML checks on submit | Demo tool — not a production default |
| name / id | Identify the form element itself | Useful when scripts or CSS target the form |
Öznitelikli iletişim formu
Abone iskeletini genişletin: etiketli alanları tutun; açılış form etiketini süsleyin.
<form
id="contact"
name="contact"
action="/contact"
method="post"
autocomplete="on">
<label for="full-name">Name</label>
<input id="full-name" name="full_name" type="text" required>
<label for="msg">Message</label>
<textarea id="msg" name="message" rows="3" required></textarea>
<button type="submit">Send</button>
</form>
İletişim demosunu okuyun
- id/name formu tanımlar
- action açık yol
- post mesajı adres çubuğundan uzak tutar
- autocomplete=on otomatik doldurmaya izin verir
- alan name’leri payload anahtarı
- required alan düzeyinde
GET arama ve isteğe bağlı novalidate
Arama sıkça get kullanır ki sorgu URL’de kalsın. Hassas veri değil. Alıştırma için autocomplete=off. novalidate yalnızca özel demolar.
<form action="/search" method="get" autocomplete="off">
<label for="q">Search</label>
<input id="q" name="q" type="search">
<button type="submit">Go</button>
</form>
<!-- Demo-only: skip built-in checks
<form action="/demo" method="post" novalidate>
...
</form>
-->
Arama demosunu okuyun
- get ?q= ekler
- autocomplete=off otomatik doldurmayı azaltır
- required yoksa boşlar gider
- novalidate yalnızca hatırlatma
- şifreler için asla get
Boş action ve GET ile POST
- boş/atlanmış → geçerli URL
- get filtre ve arama için
- post kayıt ve mesaj için
- yalnızca method güvenlik değildir
Alıştırma — öznitelikleri ayarlayın
- action’ı boşaltın
- arama method’unu değiştirin
- iletişimde autocomplete=off
- required ile geçici novalidate
- novalidate’i kaldırın
- form id ve alan name’lerini doğrulayın
- Cümle: öznitelikler hedef, stil, otomatik doldurma, kontrolleri ayarlar
Kolay hatalar
- Boş action sürprizi
- get ile şifre
- canlıda kalıcı novalidate
- form name ile alan name’ini karıştırmak
- off’u güvenlik garantisi sanmak
- action ile method’u yer değiştirmek
Özet
- Öznitelikler gönderimi inceler
- action + method çekirdek; boş → geçerli URL
- autocomplete ve novalidate isteğe bağlı
- form name/id vs alan name
- özel için post
- sırada: form öğeleri
🧠 Bilginizi Test Edin
Bilginizi Test Edin
Bu interaktif sınavla kendini test et ve konuyu ne kadar iyi anladığını gör
📝 Talimatlar
- Her soruyu dikkatle okuyun
- Her soru için en iyi cevabı seçin
- Quiz'i istediğiniz kadar tekrar alabilirsiniz
- İlerlemeniz üstte gösterilecek