Hidden input
<input type="hidden"> ile form meta verisi gönderirsin.
Gizli input nedir?
Bazen forma kullanıcıya görünmeyen ama sunucuya gönderilmesi gereken veri koyarsın: sipariş kimliği, CSRF token'ı, oturum değeri gibi. Bunun için <input type="hidden"> kullanılır.
Gizli input ekranda yer kaplamaz. Yine de name ve value öznitelikleriyle birlikte form gönderildiğinde sunucuya gider.
Örnek: <input type="hidden" name="product_id" value="4271">. Kullanıcı bunu görmez; ama form gönderildiğinde product_id=4271 sunucuya ulaşır.
Gizli input'un kullanımları
Gizli input'un üç yaygın kullanımı vardır:
- CSRF token: kötü niyetli form gönderimini engellemek için sunucunun verdiği rastgele değer.
- Kayıt kimliği: hangi kaydın düzenlendiğini sunucuya bildirmek (örneğin
product_id). - Oturum ya da adım: çok adımlı formlarda hangi adımda olduğunu söylemek.
Gizli input güvenlik sağlamaz; kullanıcı HTML'i inceleyip değeri görebilir. Onu yalnızca 'kullanıcının değiştirmesini istemediğin veri' için kullan.
Uygulama Gizli input'lu sipariş formu yaz
Body içine bir <form> ekle. İçine görünür bir <input type="text" name="full_name"> koy. Ardından iki gizli input ekle: birincinin name="product_id" ve value="4271", ikincinin name="csrf_token" ve value="abc123" olsun.
Örnek çözümü göster
<body>
<form>
<label for="ad">Ad Soyad</label>
<input type="text" id="ad" name="full_name">
<input type="hidden" name="product_id" value="4271">
<input type="hidden" name="csrf_token" value="abc123">
</form>
</body>
Kendini test et
-
Hangi durumda <input type="hidden"> kullanmak uygundur?
- Sayfanın başlığını saklamak
- Bir düğmeyi gizlemek
- Sunucuya form kimliği göndermek
- Bir paragrafı gizlemek
Cevabı göster
Sunucuya form kimliği göndermek — Doğru. Gizli input, sunucuya görünmeden veri (örneğin form kimliği) göndermek için kullanılır.
-
Gizli input'u tamamla
<input type="____" name="product_id" value="4271">Cevabı göster
<input type="hidden" name="product_id" value="4271"> -
Kullanımı değerle eşleştir
- CSRF token
- Rastgele güvenlik değeri
- product_id
- Kayıt kimliği
- step
- Form adımı
- session_id
- Oturum kimliği