Ce face <input type=hidden>
<input type="hidden"> nu apare pe pagină și nu ocupă spațiu, dar valoarea lui este trimisă împreună cu formularul, ca orice alt câmp. Se folosește pentru date de care serverul are nevoie, dar pe care utilizatorul nu trebuie să le completeze: id-ul articolului editat, pasul dintr-un formular în mai mulți pași, un token de securitate.
„Ascuns” nu înseamnă secret sau protejat. Oricine poate vedea valoarea în codul sursă al paginii și o poate modifica din instrumentele browserului înainte de trimitere. Serverul trebuie deci să verifice valoarea primită, de exemplu că utilizatorul are dreptul să editeze articolul cu acel id.
Un caz special: un câmp ascuns cu name="_charset_" și fără valoare primește automat codificarea în care este trimis formularul (de obicei UTF-8).
Atribute
| Atribut | Descriere |
|---|---|
name |
Numele sub care valoarea ajunge la server. |
value |
Valoarea trimisă. Poate fi schimbată din JavaScript. |
Exemple
Exemplul 1: Id-ul produsului într-un formular „Adaugă în coș”
Utilizatorul alege doar cantitatea; serverul află din câmpul ascuns ce produs este.
<form action="/cos" method="post">
<input type="hidden" name="produs_id" value="1042">
<label for="buc">Bucăți</label>
<input type="number" id="buc" name="cantitate" min="1" value="1">
<button>Adaugă în coș</button>
</form>
Ce afișează browserul
Pe pagină apar doar câmpul „Bucăți” și butonul.
Serverul primește produs_id=1042&cantitate=1.
Exemplul 2: Token împotriva atacurilor CSRF
Serverul generează tokenul pentru sesiunea utilizatorului și îl compară la primire; un formular trimis de pe alt site nu îl cunoaște.
<form action="/cont/sterge" method="post">
<input type="hidden" name="csrf_token" value="b7f3c91e04a24d6f">
<button>Șterge contul</button>
</form>
Ce afișează browserul
Pe pagină apare doar butonul „Șterge contul”.
La trimitere, serverul verifică dacă csrf_token corespunde sesiunii; altfel refuză cererea.
Greșeli frecvente
- Păstrarea prețului într-un câmp ascuns și folosirea lui la plată: utilizatorul îl poate schimba din instrumentele browserului. Prețul se citește mereu din baza de date.
- Punerea de date secrete (parole, chei API) în câmpuri ascunse: sunt vizibile în codul sursă al paginii.
- Adăugarea lui
requiredsau a altor reguli de validare: câmpurile ascunse nu sunt validate de browser.
Comenzi înrudite
<form>: Containerul principal pentru colectarea datelor de la utilizator și trimiterea lor către un server.<input>: Cel mai versatil element de formular: își schimbă complet aspectul și funcția în funcție de atributul type.<button>: Element clicabil pentru declanșarea trimiterii formularelor sau a unor acțiuni JavaScript în pagină.