Forme HTML

HTML forms permit realizarea unor instrumente interactive.

          O HTML form este o sectiune a unui document Web in care utilizatorul
          poate introduce informatii. Acestea sunt trimise catre Web server unde
          pot fi inregistrate intr-o baza de date pentru utilizari ulterioare sau pentru
          controlul informatiilor returnate utilizatorului.

Crearea unei forme HTML

          Se realizeaza prin etichete HTML (prin adaugarea si selectarea
          proprietatilor unei forme folosind un instrument de creare a paginilor
          HTML de tipul Page Composer sau utilizand un simplu editor text).

Un exemplu de forma HTML

          Intr-o sursa HTML, o forma este semnalizata prin eticeta:
          <FORM>...</FORM>. Daca avem un program ce va procesa datele
          trimise de forma (form handler, cel mai ades un program CGI) se va
          adauga formei atributul ACTION="url" pentru a indica pozitia
          programului si atributul METHOD=reqtype  pentru metoda de transmisie
 

              Etichetele <FORM> ... </FORM> grupeaza campurile de introducere
          impreuna si definesc cum si unde vor fi procesate.

               In cadrul etichetelor <FORM> .. </FORM>, sunt valabile urmatoarele
          etichete HTML (componente ale formei):


          INPUT TYPE=TEXT

               <INPUT [TYPE=TEXT] NAME="text-identificator"
               [SIZE=nn] [MAXLENGTH=nn] [VALUE="default
               text"]>

                Atributul SIZE se foloseste pentru specificarea numarului de caractere
          care sa caracterizeze dimensiunea ferestrei de introduere.
          Atributul MAXLENGTH se foloseste pentru limitarea numarului de caractere
          de intrare. Daca valoarea MAXLENGTH este mai mare decat valoarea
          SIZE, atunci browser-ul va permite scroll pe textul de intrare.
          Atributul VALUE se foloseste pentru afisarea unui text de intrare implicit,
          ce va fi afisat odata cu forma si va putea fi modificat prin editare.


          INPUT TYPE=SUBMIT

               <INPUT TYPE=SUBMIT [NAME="button-id"]
               [VALUE="Button label text"]>

                 Eticheta INPUT  cu TYPE=SUBMIT furnizeaza un buton care transmite
          informatia din forma completata catre URL dat ca atribut ACTION in
          eticheta <FORM>. Informatia este transmisa prin tipul de apel HTTP
          specificat de atributul METHOD al formei. O forma poate avea mai multe
          butoane SUBMIT identificabile prin valoarea din atributul optional NAME.


          INPUT TYPE=RESET

               <INPUT TYPE=RESET [VALUE="Button label
               text"]>

             O eticheta cu TYPE=RESET furnizeaza un buton care sterge forma si
          seteaza continutul la valorile initiale.


          INPUT TYPE=RADIO

               <INPUT TYPE=RADIO NAME="radio-set-id"
               VALUE="choice-id" [chECKED]>

              Este o forma ce permite utilizatorului sa aleaga dintr-un set de alternative.
          Fiecare buton radio din setul de alternative din forma are aceeasi valoare
          a atributului. Evident, un singur buton radio poate fi selectat o data.
          Atributul VALUE specifica datele transmise.


          INPUT TYPE=CHECKBOX

               <INPUT TYPE=CHECKBOX NAME="box-set-id"
               VALUE="choice-id" [chECKED]>

              O eticheta INPUT cu atributul TYPE=chECKBOX ofera utilizatorului
          posibilitatea de a alterna intre "on" si "off". Este oarecum similar
          butoanelor radio. cu diferenta ca oricate checkboxes pot fi selectate sau
          nu. Un checkbox selectat ("on") la transmiterea formei isi va transmite
          propria VALUE pentru componenta respectiva. Mai multe checkboxes pot
          fi grupate (ca si butoanele radio) prin utilizarea aceluiasi atribut NAME.
          Datele transmise in forma sunt cele specifice componentelor "on"
          (selectate), separate prin virgula.
 


          INPUT TYPE=IMAGE

               <INPUT TYPE=IMAGE NAME="image-id"
               SRC="image-url" [ALIGN=alignment]>

          Eticheta de forma INPUT TYPE=IMAGE este similara etichetei IMG
          HTML. Are ca rezultat afisarea imaginii de la locatia SRC cu optiunea
          ALIGN.
          O astfel de forma are doua caracteristici ce o fac utila:
          la "click" pe image, datele formei completate sunt transmise, analog unei
          componenteINPUT TYPE=SUBMIT.


          TEXTAREA

               <TEXTAREA NAME="text-id" [COLS=nn]
               [ROWS=nn]>default text</TEXTAREA>

          Eticheta TEXTAREA prezinta o fereastra pentru editare de text pe mai
          multe linii (este un container HTML). Textul continut intre etichetele
          <TEXTAREA> si </TEXTAREA> apare ca fiind un continut implicit
 



          SELECT

          <SELECT NAME="select-id" [SIZE=nn] [MULTIPLE]>
          <OPTION [VALUE="choice-id"] [SELECTED]>1st choice
          <OPTION>2nd choice
          <OPTION>...
          </SELECT>

                  Eticheta SELECT este o alternativa a butoanelor radio si checkboxes,
          prezentand o lista de optiuni intr-o fereastra cu defilare (scrolling
          window). Daca atributul MULTIPLE este folosit, SELECT este
          comparabil cu checkboxes in sensul posibiltatii selectarii mai multor
          variante. Atributul SIZE specifica numarul variantelor vizibile (controland
          deci dimensiunea ferestrei de afisare). Atributul VALUE al fiecarei
          OPTIONiuni selectate este transmis prin datelei formei pentru a procesare
          (daca atributul este omis, se transmite continutul optiunii selectate). Daca
          se selecteaza mai multe optiuni, atributele VALUE sunt transmise
          impreuna intr-o lista, separate prin virgula.
 

            Exercitiu: