<input type=hidden> în HTML

Câmpul ascuns: trimite la server o valoare pe care utilizatorul nu o vede, cum ar fi un id de produs sau un token.

Sintaxă tag
<input type="hidden" name="produs_id" value="1042">

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 required sau 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ă.