Lucrul cu formularele

Formulare

Formularele în HTML reprezintă una dintre metodele pentru introducerea și trimiterea datelor. Toate câmpurile formularului sunt plasate între tag-urile <form> și </form>. De exemplu, să creăm cea mai simplă formă:

<!DOCTYPE html>
<html>
   <head>
       <meta charset="utf-8">
       <title>Formulare în HTML5</title>
   </head>
   <body>
       <form method="post" action="http://localhost:8080/login.php">
           <input name="login"/>
           <input type="submit" value="Intră" />
       </form>
   </body>
</html>

Pentru configurarea formularelor, elementul form are definite următoarele atribute:

- method: stabilește metoda de trimitere a datelor către server. Sunt permise două valori: post și get.

Valoarea post permite transmiterea datelor către web-server prin intermediul anteturilor speciale. În timp ce valoarea get permite transmiterea datelor prin linia de cerere.

- action: stabilește adresa la care sunt trimise datele formularului - enctype: stabilește tipul datelor transmise. Poate lua următoarele valori:

application/x-www-form-urlencoded: codarea datelor trimise implicit
multipart/form-data: această codare este aplicată la trimiterea fișierelor
text/plain: această codare este aplicată la trimiterea informațiilor text simple

În exemplul de mai sus:

<form method="post" action="http://localhost:8080/login.php">
   <input name="login"/>
   <input type="submit" value="Intră" />
</form>

Formularul este setat cu metoda "post", adică toate valorile formularului sunt trimise în corpul cererii, iar adresa este http://localhost:8080/login.php. Adresa aici este specificată în mod arbitrar.

De obicei, la adresa specificată funcționează un web-server care, utilizând una dintre tehnologiile de server-side (PHP, NodeJS, ASP.NET etc.), poate primi cereri și returna răspunsuri. În acest caz, ne vom concentra doar pe mijloacele HTML care permit trimiterea datelor către server.

Autocomplete

Adesea, browserele web memorează datele introduse, și la introducerea de noi date, browserele pot afișa o listă de sugestii din cuvintele introduse anterior:

Acest lucru nu este întotdeauna convenabil, și cu ajutorul atributului autocomplete putem dezactiva completarea automată:


<form method="post" autocomplete="off" action="http://localhost:8080/login.php">
   <input name="login" />
   <input name="password" />
   <input type="submit" value="Intră" />
</form>

Dacă dorim să activăm completarea automată doar pentru anumite câmpuri specifice, putem aplica atributul autocomplete="on" acestora:

<form method="post" autocomplete="off" action="http://localhost:8080/login.php">
   <input name="login" />
   <input name="password" autocomplete="on" />
   <input type="submit" value="Intră" />
</form>

Acum, pentru întregul formular, cu excepția celui de-al doilea câmp, completarea automată va fi dezactivată.