Home » Resurse Web Design » Crearea formularelor HTML

 
 
 

Crearea formularelor HTML

Modulul 3:
Crearea formularelor HTML
Scopuri

• Învăţaţi să proiectaţi formulare HTML eficiente şi uşor de utilizat
• Învăţaţi să creaţi formulare HTML care includ controale ce acceptă text şi opţiuni ale utilizatorului
• Învăţaţi să scrieţi programe PHP care obţin accesul la datele ce provin din formularele HTML
Majoritatea programelor PHP folosesc formulare HTML pentru a prelua datele de la utilizator şi pentru a afişa rezultatele calculelor, în cadrul acestui modul, veţi învăţa să creaţi formulare HTML care permit programelor dumneavoastră HTML să interacţioneze cu utilizatorul.
Noţiuni fundamentale de proiectare a formularelor
Unii programatori experimentaţi cred că pot determina instantaneu şi în mod intuitiv aspectul şi modul de funcţionare ale oricărui formular HTML. În loc de a proiecta un formular HTML, aceşti programatori pur şi simplu îl creează. Deseori, rezultatele descalifică pretenţiile acestor programatori cu privire la cunoştinţele obţinute intuitiv. Multe formulare de proastă calitate au fost create în acest mod.
O metodă mai bună, atât pentru programatorii neexperimentaţi, cât şi pentru cei cu experienţă, este proiectarea formularului anterior creării acestuia, în faza de proiectare, luaţi în considerare metode alternative de aranjare a formularului şi, în cele din urmă, identificaţi o structură mai bună decât celelalte. Dacă nu aţi avut în vedere alternative, nu aveţi nici un motiv de a crede că structura formularului dumneavoastră este mai bună decât alte structuri posibile. Ca atare, dacă „săriţi” peste faza de proiectare veţi obţine formulare de calitate inferioară.

Proiectarea unui formular

O modalitate oportună de proiectare a unui formular constă în utilizarea hârtiei şi a creionului. O tablă de culoare albă sau neagră este o soluţie şi mai bună, dacă dispuneţi de aşa ceva. În cazul în care preferaţi instrumentele automatizate, puteţi folosi un editor HTML de tip WYSIWYG. Toate aceste metode de proiectare au un element comun: se pot şterge cu uşurinţă o parte sau chiar toate elementele de
proiectare existente şi se poate relua activitatea de la început. Cercetări efectuate asupra activităţii de proiectare au arătat că proiectanţii cu experienţă o iau de la început mai frecvent decât cei neexperimentaţi; aceştia din urmă tind să se canto­neze într-o structură iniţială şi nu iau în considerare alternative potenţial mai bune.

Principalele sarcini în proiectarea unui formular HTML le constituie alegerea controalelor HTML care vor fi incluse în formular, selectarea amplasamentului controalelor şi alegerea etichetelor acestora. Cu toate acestea, proiectarea nu este un proces de tip „pas cu pas”, care poate fi parcurs în mod mecanic. Este un proces bazat pe oportunism, ceea ce înseamnă că modalitatea optimă de a parcurge urmă­toarea etapă de proiectare este „în orice mod posibil”. Iată câteva instrucţiuni elementare pentru proiectarea formularelor HTML:

• Alegeţi controale care sunt adecvate pentru categoria de date pe care le adună şi pentru interacţiunile pe care le furnizează. Secţiunea următoare, care explică fiecare control HTML în parte, vă va ajuta să procedaţi astfel.

• Etichetări cu claritate fiecare control, astfel încât utilizatorul să înţeleagă funcţia acestuia.

•În măsura posibilităţilor, aliniaţi etichetele şi marginile din stânga ale controalelor. Structura unui formular bine proiectat este asemănătoare cu aceea a unei pagini de ziar, fiind compusă dintr-o serie de coloane în cadrul cărora fiecare element vizual este aliniat cu elementele plasate deasupra, respectiv dedesubtul său. Puteţi obţine acest tip de structură folosind tabele HTML sau eticheta BR.

• Grupaţi controalele corelate şi separaţi fiecare asemenea grup de celelalte grupuri prin încorporarea de spaţii albe în structura dumneavoastră.

• Secvenţa de controale din formular trebuie să fie asemănătoare cu ordinea în care le va manipula utilizatorul. In caz contrar, utilizatorul va fi obligat să piardă timp navigând de la un control la altul.

Este important să reţineri că acestea sunt doar îndrumări, nu reguli. Nefiind reguli, puteţi opta pentru încălcarea lor, din când în când. Acest lucru nu constituie o greşeală, atât timp cât sunteţi convins că rezultatul încălcării unei recomandări este superior rezultatului respectării acesteia. De exemplu, recomandările pot reprezenta îndrumări contradictorii într-o anumită situaţie, în acest caz, sunteţi obligat să încălcăţi o recomandare sau alta.

Pentru a determina dacă o variantă de proiectare este superioară alteia, este util să cereţi părerea unui utilizator. Dacă nici un utilizator nu vă poate fi de ajutor, obţineţi asistenţa unui alt programator, în cel mai rău caz, străduiţi-vă să vă puneţi dumneavoastră înşivă în rolul unui utilizator al formularului, întrebaţi pe utilizator sau pe înlocuitorul acestuia dacă formularul este clar, uşor de utilizat şi eficient, în caz afirmativ, este momentul să treceţi mai departe şi să creaţi efectiv formularul HTML.

Crearea unui formular HTML

Dacă procesul de proiectare este bazat pe oportunism, procesul de creare a unui formular HTML pornind de la structura dumneavoastră este mai direct. Mai întâi, creaţi schiţa HTML elementară, care va conţine controalele din formularul dumnea­voastră. Apoi, încorporaţi controalele în structură; în particular, un formular HTML trebuie să includă un buton de expediere pe care utilizatorul execută clic pentru a trimite serverului datele din formular. Deoarece o singură pagină HTML poate conţine mai multe formulare, puteţi repeta de mai multe ori etapele intermediare ale acestui proces. Sub-secţiunile următoare detaliază procesul de creare a unui for­mular HTML.

Crearea structurii HTML

Structura HTML pe care o folosiţi pentru a include un formular nu este deloc diferită, de fapt, de cea folosită pentru includerea unei pagini HTML obişnuite. De exemplu, iată o structură caracteristică:

<HTML>

<HEAD>

<TITLE>Titlul paginii este inserat aici</TITLE>

</HEAD>

<BODY>

Conţinutul paginii sau al formularului este inserat aici

</BODY>

</HTML>

In interiorul corpului unei pagini HTML care conţine un formular puteţi folosi orice etichetă HTML obişnuită. Pentru a descrie formularul în sine, folosiţi eticheta FORM, care are următoarea formă elementară:

<FORM METHOD=”metoda” ACTION=”url”>

Atributul METHOD al etichetei FORM poate lua una din valorile GET sau POST. Pentru moment, specificaţi întotdeauna valoarea POST. Atributul ACTION specifică adresa URL a scriptului PHP care prelucrează datele adunate prin intermediul formula­rului. Adresa URL poate fi o adresă completă, care include protocolul, numele gazdei şi calea de acces, respectiv o adresă parţială, care specifică o locaţie relativă la locaţia paginii curente, între eticheta FORM si eticheta sa /FORM corespunzătoare, plasaţi controalele formularului.

<Sfatul specialistului>

Întrebare:Când creez un formular HTML, când trebuie să specific GET în loc de POST ca valoare a atributului METHOD?

Răspuns: Ca începător, este mai bine să folosiţi în mod consecvent metoda POST, deoarece alegerea între metodele GET si POST este destul de complicată. </Sfatul specialistului>

Ca regulă empirică, mulţi programatori folosesc GET pentru formulare care execută o căutare sau o interogare, respectiv POST pentru formulare care actualizează o bază de date sau un fişier. Două dezavantaje ale metodei GET sunt acelea că impune o limită asupra cantităţii de date care pot fi trimise scriptului de prelucrare şi că transferă date prin ataşarea şirurilor codificate la adresa URL a scriptului de prelucrare. Astfel, datele trimise prin metoda GET pot fi vizualizate de către utilizator. Un avantaj al metodei GET este acela că utilizatorii pot insera semne de carte în rezultatele unei interogări sau ale unei căutări care foloseşte metoda GET, dar nu pot executa aceeaşi operaţie în cazul unei interogări sau al unei căutări care foloseşte metoda POST. Desigur, utilizatorii pot insera un semn de carte la pagina care conţine un formular ce foloseşte metoda POST; rezultaele sunt cele unde nu se poate insera semnul de carte.

Încorporarea controalelor

Această sub-secţiune descrie două controale elementare pe care le veţi folosi frecvent: caseta cu text şi butonul de expediere. In secţiunea următoare, veţi afla mai multe despre controalele pe care le puteţi folosi în construcţia formularelor HTML.

O casetă cu text permite utilizatorului să tasteze informaţii care pot fi apoi trimise unui script PHP. Casetele cu text sunt frecvent folosite pentru a obţine date precum numele utilizatorului, adresa sa poştală sau adresa de e-mail. Pentru a crea o casetă cu text, scrieţi o etichetă HTML care are următoarea formă elementară:

<INPUT TYPE=”TEXT” NAME=”text”>

Atributul NAME atribuie casetei cu text un nume, astfel încât conţinutul său să fie accesibil unui script PHP. Numele pe care îl atribuiţi unui control trebuie să fie unic în cadrul formularului şi trebuie să respecte regulile pentru denumirea variabile!or PHP, cu excepţia faptului că numele nu trebuie să înceapă cu simbolul dola­rului. Cu alte cuvinte, numele trebuie să înceapă cu o literă si nu trebuie să conţină alte caractere în afara literelor, a cifrelor şi a caracterelor de subliniere; în particular, numele nu trebuie să conţină spaţii. HTML nu are o etichetă /INPUT, deci nu încer­caţi să combinaţi o etichetă INPUT cu o asemenea etichetă.

Un buton de expediere permite utilizatorului să trimită serverului conţinutul unui formular. Fiecare formular HTML trebuie să aibă un buton de expediere. Pentru a crea un buton de expediere, scrieţi o etichetă HTML care are următoarea formă elementară:

<INPUT TYPE=”SUBMIT” VALUE=”text”>

Atributul VALUE specifică textul care trebuie să apară pe suprafaţa butonului de expediere.

42

Iată un formular HTML complet, care include casete cu text ce preiau numele şi adresa de e-mail a utilizatorului:

<HTML>

<HEAD>

<TITLE>Numele şi adresa de e-mail ale utilizatorului</TITLE>

</HEAD>

<BODY>

<FORM METHOD=”POST” ACTION=”phpinfo.php”>

<H3> Numele şi adresa de e-mail ale utilizatorului</H3>

<BR>Nume:

<BR><INPUT TYPE=”TEXT” NAME=”numele_utilizatorului”>

<BR>Adresa de e-mail:

<BR><INPUT TYPE=”TEXT” NAME=”adresa_email”>

<BR>

<BR><INPUT TYPE=”SUBMIT” VALUE=”Trimite datele”>

</FORM>

</BODY>

</HTML>

Observaţi utilizarea etichetelor BR pentru alinierea etichetelor şi a con­troalelor, precum şi numele atribuite controalelor de tip casetă cu text. Când utilizatorul execută clic pe butonul de expediere, datele introduse de utilizator sunt trimise scriptului phpinfo.php. Ilustraţia alăturată prezintă aspectul formularului.

<imagine> Numele şi adresa de e-mail ale utilizatorului

Nume

Adresa de e-mail:

Trimite datele </imagine>

Lucrul cu formulare multiple

In interiorul corpului unei pagini HTML se pot include mai multe for-

mulare. Dacă procedaţi astfel, nu uitaţi să inseraţi o etichetă </FORM> anterior etichetei <FORM> a următorului formular. Browserul utilizatorului va face indigestie dacă suprapuneri formulare într-o pagină.

Iată un exemplu simplu de pagină care conţine mai multe formulare:

<HTML>

<HEAD>

<TITLE>Numele şi adresa de e-mail ale utilizatorului</TITLE>

</HEAD>

<BODY>

<FORM METHOD=”POST” ACTION=”phpinfo.php”>

<H3> Numele şi adresa de e-mail ale utilizatorului</H3>

<BR>Nume:

<BR><INPUT TYPE=”TEXT” NAME=”numele_utilizatorului”>

<BR>Adresa de e-mail:

<BR><INPUT TYPE=”TEXT” NAME=”adresa_email”>

<BR>

<BR><INPUT TYPE=”SUBMIT” VALUE=”Trimite datele”>

</FORM>

<FORM METHOD=”POST” ACTION=”phpinfo.php”>

<H3> Numerele de telefon şi fax ale utilizatorului</H3>

<BR>Număr de telefon:

<BR><INPUT TYPE=”TEXT” NAME=”telefon”>

<BR>Fax

<BR><INPUT TYPE=”TEXT” NAME=”fax”>

<BR>

<BR><INPUT TYPE=”SUBMIT” VALUE=”Trimite datele”>

</FORM>

</BODY>

</HTML>

Când utilizatorul execută clic pe butonul de expediere, datele incluse în câm­purile formularului care conţine butonul pe care s-a executat clic sunt trimise la server. Astfel, serverul primeşte fie un nume şi o adresă de e-mail, fie numerele de telefon şi de fax, nu conţinutul tuturor celor patru câmpuri.

<Sfatul specialistului>

Întrebare: Dacă aptitudinile mele în materie de HTML sunt reduse sau „ruginite”? Unde îmi pot revizui cunoştinţele de HTML pentru a putea crea formulare?

Răspuns:Pentru a învăţa sau pentru a recapitula elementele fundamentale ale limbajului HTML, vă propun cartea lui Wendy Willard HTML: Ghidul începăto­rului (Osborne, 2000)*. Ca şi alte volume din seria Ghidul începătorului, cartea lui Wendy conţine teste „la minut” şi proiecte care contribuie la consolidarea mate­rialului citit. De asemenea, cartea mai conţine module referitoare la JavaScript şi foile de stil în cascadă, tehnologii care pot fi utilizate eficient alături de PHP. </Sfatul specialistului>

<Test „la minut”>

• Care sunt atributele care trebuie specificate în eticheta FORM?

• Care este controlul pe care trebuie să-1 conţină toate formularele HTML?

• Care este eticheta HTML folosită pentru crearea unei casete cu text? </Test „la minut”>

<Notă>

Sau oricare dintre excelentele cărţi de HTML traduse şi publicate de Editura Teora. -NT. Răspunsuri la test:

• Atributele METHOD şi ACTION

• Butonul de expediere

• INPUT</Notă>

Proiectul 3-1: Vizualizarea câmpurilor unui formular

În cadrul acestui proiect, veţi învăţa să vizualizaţi datele transmise de un formular HTML către scriptul său de prelucrare. Veţi descoperi utilitatea acestei caracteristici atunci când trebuie să depanaţi un formular HTML sau un script de prelucrare.

<Scopurile proiectului>

• Exersarea creării unui script PHP si a unui formular HTML

• Capacitatea de a sesiza rezultatele expedierii unui formular HTML</Scopurile proiectului>

Pas cu pas

1 . Plasaţi următorul script HTML într-un fişier denumit p-3-1 .php şi încărcaţi acest fişier în serverul dumneavoastră PHP:

<?php

// Fişierul p-3-1.php

?>

2. Plasaţi următoarea pagină HTML într-un fişier denumit p-3-1 .html şi încărcaţi acest fişier în serverul dumneavoastră PHP, plasându-l în acelaşi catalog ca şi fişierul p-3-1 .php:

<HTML>

<HEAD>

<TITLE>Numele şi adresa de e-mail ale utilizatorului</TITLE>

</HEAD>

<BODY>

<!–Fişierul p-3-1.html –>

<FORM METHOD=”POST” ACTION=”p-3-1.php”>

<H3> Numele şi adresa de e-mail ale utilizatorului</H3>

<BR>Nume:

<BR><INPUT TYPE=”TEXT” NAME=”numele_utilizatorului”>

<BR>Adresa de e-mail:

<BR><INPUT TYPE=”TEXT” NAME=”adresa_email”>

<BR>

<BR><INPUT TYPE=”SUBMIT” VALUE=”Trimite datele”>

</FORM>

</BODY>

</HTML>

3. Orientaţi un browser Web spre adresa URL a fişierului care conţine formularul HTML. Introduceţi numele unui utilizator şi adresa sa de e-mail, apoi executaţi clic pe butonul de expediere.

4. Când scriptul de prelucrare p-3-1 .php este executat, acesta afişează un raport amănunţit cu privire la starea serverului PHP. În secţiunea intitulată „Variabile PHP”, puteţi găsi informaţii cu privire la cele două controale de tip casetă cu text, în speţă nume_utilizator şi adresa_email, aşa cum se poate vedea în ilustraţia următoare. Remarcaţi valorile introduse de utilizatorul formularului.

45

<imagine>

PHP Variables

Variable Value

PHP_SELF /~bmccarty/php/module-03/proiect-3-1a.php

HTTP_POST_VARS[“user_name”] Bill McCarty

HTTP_POST_VARS[“email_address”] mccartyb@osborne.com Această adresă de e-mail este protejată de spamboţi; aveţi nevoie de activarea JavaScript-ului pentru a o vizualiza </imagine>

Crearea controalelor formularului

În secţiunea anterioară, aţi învăţat să creaţi controalele de tip casetă cu text şi buton de expediere, în secţiunea de faţă şi în cea următoare, veţi extinde repertoriul controalelor dumneavoastră astfel încât să includeţi întreaga gamă de controale disponibile.

Crearea casetelor cu text personalizate

Secţiunea precedentă a prezentat sintaxa elementară pentru crearea unei casete cu text. Cu toate acestea, HTML furnizează numeroase atribute suplimentare care vă permit să modificaţi aspectul şi comportamentul unei casete cu text. Iată sintaxa completă pentru crearea unei casete cu text:

<INPUT TYPE=”TEXT” NAME=”text” SIZE=”numar” MAXLENGTH=”numar” value=”text”>

Atributele TYPE şi NAME sunt obligatorii; celelalte atribute sunt opţionale. Atributul SIZE, care este dat sub forma unui număr de caractere, stabileşte dimensiunea vizibilă a casetei cu text; atributul MAXLENGTH specifică numărul maxim de caractere pe care utilizatorul are permisiunea de a le tasta. Valoarea atributului MAXLENGTH o poate depăşi pe aceea a atributului SIZE, în care caz conţinutul controlului defilează spre dreapta atunci când utilizatorul a introdus SIZE caractere. Atributul VALUE constituie o valoare care este afişată iniţial în caseta cu text.

<Sugestie>

Este important să cunoaşteţi aspectul şi modul de comportare a casetei cu text şi a altor controale HTML de formular. Proiectul care apare la sfârşitul acestei secţiuni vă va oferi posibilitatea de a acumula experienţă în crearea controalelor şi în lucrul cu acestea.</sugestie>

46

Crearea de suprafeţe cu text

Ca o casetă cu text, o suprafaţă cu text permite unui utilizator să introducă text. Cu toate acestea, o suprafaţă cu text poate permite utilizatorului să introducă mai multe linii de text, în timp ce o casetă cu text permite utilizatorului să introducă o singură linie. Iată sintaxa pentru crearea unei suprafeţe cu text:

<TEXTAREA NAME=”text” ROWS=”numar” COLS=”numar” WRAP=”wrap”>

Atributele NAME şi ROWS sunt obligatorii; atributele COLS şi WRAP sunt opţionale. Atributul ROWS specifică numărul liniilor de text vizibile în suprafaţa cu text; deoa­rece suprafaţa de text defilează după ce a fost umplută, utilizatorul poate introduce linii suplimentare. Atributul COLS specifică numărul coloanelor de text vizibile în suprafaţa cu text; deoarece suprafaţa cu text se derulează sau se înfăşoară după ce s-a umplut, utilizatorul poate introduce linii mai lungi. Atributul WRAP specifică maniera de înfăşurare a textului în interiorul suprafeţei cu text. Atributul WRAP poate avea următoarele valori:

<Valoare>Off</valoare> <descriere> înfăşurarea cuvintelor la sfârşitul liniei de text este dezactivată;utilizatorul poate introduce caractere de sfârşit de linie pentru a forţa înfăşurarea liniilor</descriere>

<valoare>Virtual</valoare> <Descriere>liniile par înfăşurate, dar caracteristica de înfăşurare a liniilor nu este trimisă la server</descriere>

<valoare>physical</valoare> <descriere> înfăşurarea cuvintelor la sfârşitul liniei de text este activată</descriere>

<valoare>soft</valoare> <descriere>Identic cu virtual</descriere>

<valoare>hard</valoare> <descriere> Identic cu physical</descriere>

O etichetă TEXTAREA trebuie combinată cu o etichetă /TEXTAREA. Orice text care apare între etichete va fi prezentat drept conţinut iniţial al controlului de tip supra­faţă cu text.

Crearea casetelor cu parolă

Dacă o aplicaţie impune unui utilizator să introducă o parolă, puteţi crea o casetă cu text în acest scop. Totuşi, când utilizatorul introduce parola, orice persoană aflată în apropiere poate vizualiza parola, situaţie care duce la o posibilă breşă de securi­tate, în loc de a se folosi o casetă cu text pentru introducerea de informaţii confi­denţiale, trebuie să folosiţi o casetă cu parolă. Pentru a crea o casetă cu parolă, folosiţi aceeaşi sintaxă ca şi cea utilizată pentru crearea unei casete cu text, cu excepţia faptului că specificaţi PASSWORD (parolă) în loc de TEXT ca valoare a atribu­tului TYPE:

<INPUT TYPE=”PASSWORD” NAME=”text” SIZE=”numar” MAXLENGTH=”numar” VALUE=”text”>

Atributele unei casete cu parolă au aceeaşi semnificaţie ca şi acelea ale unei casete cu text.

47

Crearea casetelor de validare

Pentru date care pot avea numai una din două valori, cum ar fi „pornit” sau „oprit”, caseta de validare este controlul ideal. De exemplu, caseta de validare este un control adecvat pentru a permite utilizatorului să opteze pentru livrarea rapidă a unui colet. In cazul în care caseta de validare corespunzătoare este validată, coletul va fi livrat mai rapid; în caz contrar, coletul se va deplasa cu mijloacele obişnuite.

Pentru a crea o casetă de validare, folosiri următoarea sintaxă:

<INPUT TYPE=”CHECKBOX” NAME=”text” CHECKED VALUE=”text”>

Atributul TYPE este obligatoriu; atributele NAME, CHECKED şi VALUE sunt opţionale. Dacă atributul CHECKED apare, caseta de validare va fi selectată în mod prestabilit; în caz contrar, caseta de validare nu este selectată iniţial. Atributul VALUE specifică valoarea care este trimisă serverului în cazul în care caseta de validare este selectată; dacă atributul nu este specificat, se va trimite valoarea on (activat).

Crearea butoanelor radio

Ca şi casetele de validare, butoanele radio pot avea numai una din două valori. Cu toate acestea, butoanele radio sunt organizate în grupuri, iar la un moment dat poate fi activat un singur buton radio din cadrul unui grup; toate celelalte trebuie să fie dezacti­vate. Butoanele radio sunt utile pentru a permite unui utilizator să aleagă dintr-o serie de alternative mutual exclusive. De exemplu, puteţi folosi un set de trei butoane radio pentru a permite utilizatorului să specifice tipul de ambalaj pentru cadou: fără ambalaj, cu ambalaj simplu sau sofisticat Numai unul dintre cele trei butoane radio poate fi activat; la un loc, setul de butoane radio oferă utilizatorului o triplă opţiune.

Pentru a crea un buton radio, folosiţi următoarea sintaxă:

<INPUT TYPE=”RADIO” NAME=”text” CHECKED VALUE=”text”>

Reţineţi că aceasta este aceeaşi sintaxă folosită pentru crearea unei casete de validare, cu deosebirea că atributul TYPE are valoarea RADIO în locul valorii CHECKBOX. Atributele unui buton radio au aceeaşi semnificaţie ca şi acelea ale unei casete de validare. Totuşi, atributul NAME este obligatoriu pentru butoanele radio, chiar dacă este opţional pentru casetele de validare. Toţi membrii unui set de casete de validare prezintă aceeaşi valoare a atributului NAME.

Crearea de selecţii

O selecţie este un meniu care defilează, de unde utilizatorul poate alege una sau mai multe opţiuni. De exemplu, într-o selecţie pot fi enumerate garniturile pentru pizza, astfel încât un utilizator să poată selecta orice combinaţie de garnituri pe care o doreşte. Pentru a crea o selecţie, folosiţi următoarea sintaxă:

48

<SELECT NAME=”text” MULTIPLE SIZE=”numar”> etichetele OPTION se inserează aici</SELECT>

Eticheta SELECT este folosită în combinaţie cu eticheta /SELECT, între cele două etichete este inclusă o serie de etichete OPTION.

Într-o etichetă SELECT, numai atributul NAME este obligatoriu. Atributul MULTIPLE arată că utilizatorul poate alege mai multe opţiuni menţinând apăsată tasta CTRL şi executând clic pe acestea. În absenţa atributului MULTIPLE, utilizatorul poate selecta o singură opţiune. Dacă specificaţi atributul MULTIPLE, trebuie să specificaţi şi un atribut NAME, care atribuie un nume de tablou ca nume al controlului. De exemplu, un control de tip selecţie care permite utilizatorului să aleagă mai multe garnituri pentru desert trebuie denumit folosind sintaxa garnitura[], nu garnitura.

Comportarea unei selecţii care permite o singură opţiune este echivalentă cu aceea a unui set de butoane radio, dar aspectul unei selecţii este diferit de acela al unui set de butoane radio, aşa cum veţi vedea în proiectul de la sfârşitul acestei secţiuni. Atributul SIZE specifică numărul opţiunilor vizibile. Prin utilizarea unui buton de derulare în jos sau a unei bare de defilare, utilizatorul poate manipula selecţia pentru a obţine accesul la restul opţiunilor şi a alege dintre acestea.

Aşa cum s-a arătat, o selecţie este asociată cu una sau mai multe opţiuni. Pentru a crea o opţiune care urmează a fi utilizată în cadrul unei selecţii, folosiţi următoarea sintaxă:

<OPTION SELECTED VALUE=”text”>conţinutul opţiunii este inserat aici</OPTION>

Eticheta OPTION este combinată cu o etichetă /OPTION. Textul dintre aceste eti­chete este cunoscut sub numele de conţinut al opţiunii. Conţinutul opţiunii apare în controlul SELECT. Mulţi programatori HTML omit eticheta /OPTION, caz în care textul opţiunii se extinde până la următoarea etichetă OPTION sau /SELECT. Totuşi, s-ar putea ca acest mod de utilizare să nu fie compatibil cu versiunile ulterioare ale standar­dului HTML.

Ambele atribute ale etichetei OPTION sunt opţionale. Dacă apare atributul VALUE, valoarea sa este trimisă serverului atunci când este selectată opţiunea asociată; în caz contrar, conţinutul opţiunii este trimis la server. Atributul SELECTED arată că opţiunea corespunzătoare este selectată iniţial; în caz contrar, opţiunea respectivă nu este selectată iniţial.

<titlu<Crearea câmpurilor ascunse

Uneori este utilă crearea aşa-numitelor câmpuri ascunse. Valorile câmpurilor ascunse sunt trimise la server alături de valorile altor controale; cu toate acestea, utilizatorul nu are posibilitatea de a vizualiza sau manipula valorile câmpurilor ascunse.

Câmpurile ascunse se utilizează frecvent în cadrul unei serii de formulare. De exemplu, datele introduse de utilizator în primul formular din serie pot fi necesare

49

în formularele ulterioare, în loc de a determina utilizatorul să introducă datele în fiecare formular, datele pot fi stocate într-un câmp ascuns, creat şi iniţializat de scriptul care prelucrează primul formular. Astfel, utilizatorul este scutit de o muncă suplimentară şi sunt preîntâmpinate eventualele erori, care ar fi putut apărea dacă utilizatorul nu ar fi introdus aceleaşi date în formularele ulterioare. Pentru a crea un câmp ascuns, folosiţi următoarea sintaxă:

<INPUT TYPE=”HIDDEN” NAME=”text” VALUE=”text”>

Numai atributele TYPE şi NAME sunt obligatorii; cu toate acestea, controlul este practic inutil în absenţa atributului VALUE, a cărui valoare este trimisă în mod auto­mat la server în momentul expedierii formularului.

<Sfatul specialistului>

Întrebare: Am văzut formulare HTML care permit unui utili­zator să expedieze serverului conţinutul unui fişier. Cum se poate realiza acest lucru?

Răspuns: Puteţi permite utilizatorului să aleagă un fişier şi apoi să trimită serverului conţinutul fişierului creând un control de tip fişier, prin intermediul următoarei sintaxe: <INPUT TYPE=”FILE” NAME=”nume” ACCEPT=”tip_mime” VALUE=”text”>

Atributul TYPE este singurul obligatoriu; cu toate acestea, în general, apare şi atributul NAME. Atributul VALUE specifică un nume de fişier prestabilit. Atributul ACCEPT specifică formatul conţinutului fişierului. Pot fi indicate mai multe for­mate, dar fiecare format trebuie separat de vecinii săi prin intermediul unei virgule. Formatul este specificat folosind un cod MIME (Multipurpose Internet Mail Extensions). Tabelul următor descrie formatele folosite cel mai frecvent:

<tabel>

*Tip MIME

*Tip de date

*Extensii de fişier

*application/msexcel

*Microsoft Excel

*xls

*application/msword

*Microsoft Word

*doc, dot

*application/octet-stream

*Binară

*exe

*application/pdf

*Adobe Acrobat

*pdf

*application/postscript

*Postscript

*ai, eps, ps

*application/ppt

*Microsoft PowerPoint

*ppt

*application/zip

*Date comprimate în format ZIP

*zip

*audio/midi

*Musical Instrument Digital Interface (MIDI)

*mid, midi

*audio/x-wav

*Windows Audio Format (WAV)

*wav

*image/gif

*Compuserve GraphicsInterchange Format (GIF)

*gif

*image/jpeg

*Joint Photographics Expert Group (JPEG)

*jpeg, jpg, jpe

50

*image/TIFF

*Tagged Image Format (TIF)

* tif, tiff

*text/HTML

*HTML

*htm, html

*text/plain

*Text simplu

*txt

*text/richtext

*Rich Text Format (RTF)

*rtf

*video/mpeg

*Secvenţă video

*mpg, mpv, mpe, mpeg

*video/quicktime

*Secvenţă video

* qt, mov

*video/x-msvideo

*Secvenţă video

* avi

</tabel>

Eticheta FORM de delimitare trebuie să aibă POST ca valoare a atributului său METHOD. De asemenea, trebuie să includă un atribut ENCTYPE cu valoarea multipart/ form-data. Iată sintaxa pe care trebuie să o folosiţi:

<FORM METHOD=”POST” ENCTYPE=”multipart/form-data” ACTION=”url”>

Este posibil ca serverul dumneavoastră să nu fie configurat astfel încât să accepte fiecare tip MIME. Consultaţi-vă cu administratorul serverului dumnea­voastră, pentru a determina dacă tipul de date pe care doriţi să-1 folosiri este acceptat în mod corespunzător.</sfatul specialistului>

<Test „la minut”>

• Scrieri un program HTML care creează o casetă cu text cu lăţimea egală cu 40 de caractere şi care permite utilizatorului să introducă maximum 80 de caractere.

• Scrieţi un program HTML care creează o suprafaţă cu text având lăţimea egală cu 80 de coloane, înălţimea de 10 rânduri şi care acceptă înfăşurarea textului la sfârşitul liniei de text.

• Scrieţi un program HTML care creează o casetă de validare selectată iniţial şi care trimite serverului valoarea „la modă”.

• Scrieţi un program HTML care creează o pereche de butoane radio care vă permit să specificaţi valoarea „adevărat” sau valoarea „fals”.</Test „la minut”>

Proiect 3-2 O casetă HTML aglomerată

În acest proiect, veţi crea o casetă aglomerată, un formular HTML care conţine o varietate de controale. Veţi putea manipula controalele si vizualiza datele pe care le trimit acestea unui script de prelucrare asociat formularului. Acest proiect este important pentru a dobândi o înţelegere solidă a fiecărui con­trol folosit în formularele HTML, inclusiv aspectul şi comportamentul acestuia.

<notă>

Răspunsuri la test:

• <INPUT TYPE=”TEXT” NAME=”xxxx” SIZE=’40” MAXLENGTH=”80″>

• <TEXTAREA NAME=”xxxx” COLS=”80″ ROWS=’10” WRAP=”physical”></TEXTAREA>

• <INPUT TYPE=”CHECKBOX” NAME=”xxxx” CHECKED VALUE=”la moda”>

• <INPUT TYPE=”RADIO” NAME=”xxxx” VALUE=”adevărat”> şi<INPUT TYPE=”RADIO” NAME=” xxxx ” VALUE=”fals”></notă>

51

<Scopurile proiectului>

• Acumularea de experienţă în crearea controalelor care alcătuiesc un formular HTML

• Prezentarea aspectului şi comportamentului controalelor care alcătuiesc un formular

• Furnizarea unui mod de a exersa utilizarea atributelor şi valorilor asociate etichetelor HTML care precizează controalele dintr-un formular</Scopurile proiectului>

Pas cu pas

1. Plasaţi următorul script PHP într-un fişier denumit p-3-2.php şi încărcaţi acest fişier în serverul dumneavoastră PHP:

<?php

// Fişierul p-3-2.php

phpinfo()

?>

2. Plasaţi următoarea pagină HTML într-un fişier denumit p-3-2.html şi încărcaţi acest fişier în serverul dumneavoastră PHP, plasându-l în acelaşi catalog ca şi fişierul p-3-2.php:

<HTML>

<HEAD>

<TITLE>0 caseta aglomerată</TITLE>

</HEAD>

<BODY>

<!–Fişierul p-3-2.html –>

<FORM METHOD=”POST”ACTION=”p-3-2.php”>

<H3>0 caseta ocupată</H3>

<BR> Caseta cu text:

<BR><INPUT TYPE =”TEXT”NAME=”caseta_cu_text”>

<BR>

<BR> Caseta cu parola:

<BR>INPUT TYPE=”PASSWORD „ NAME=”caseta_cu_parola”>

<BR>

<BR>Suprafaţa cu text:

<BR>

<TEXTARE NAME=”Suprafaţa_cu_text” ROWS=”5” COLS=”40” WRAP=”physical”>

Aici introduceţi adresa dumneavoastră.

</TEXTARE>

<BR>

<BR>Casete de validare:

<BR> INPUT TYPE=”CHECKBOX”

NAME=”mic_dejun”>Mic dejun

<BR> INPUT TYPE=”CHECKBOX”

NAME=”dejun”>Dejun

<BR> INPUT TYPE=”CHECKBOX”

NAME=”cina”>Cina

<BR>

<BR>Butoane radio:

<BR><INPUT TYPE=”RADIO” NAME=”butonradio”

VALUE=”francez” CHECKED>Francez

<BR><INPUT TYPE=”RADIO” NAME=”butonradio”

VALUE=”italian” CHECKED>Italian

<BR><INPUT TYPE=”RADIO” NAME=”butonradio”

VALUE=”rusesc” CHECKED>Rusesc

<BR>

<BR>

52

Selectaţi:

<BR><SELECT MULTIPLE NAME=”select[]”>

<OPTION SELECTED VALUE=”branza”>Branza

<OPTION VALUE=”Extra”>Branză Extra

<OPTION SELECTED VALUE=”pepperoni”>Pepperoni

<OPTION VALUE=”cârnaţi”>Cârnaţi

<OPTION VALUE=”salam”>Salam

<OPTION VALUE=”ciuperci”>Ciuperci

</SELECT>

<BR>

<BR>

<INPUT TYPE=”HIDDEN” NAME=”comoara”

VALUE=”inestimabilă”>

<BR>

<BR>

<BR><INPUT TYPE=”SUBMIT” VALUE=”Trimite datele”> </FORM>

</BODY>

</HTML>

3. Orientaţi un browser Web spre adresa URL a fişierului care conţine formularul HTML. Imaginea afişată pe ecran de browserul dumneavoastră trebuie să fie asemănătoare celei prezentate în figura 3-1. Examinaţi controalele din formular, observând aspectul aces­tora. Exersaţi utilizarea controalelor, pentru a vedea care sunt tipurile de comportament posibile, în momentul în care sunteţi mulţumit de valorile pe care le-aţi specificat, executaţi clic pe butonul de expediere pentru a trimite serverului datele din formular.

<figura3-1>

O casetă aglomerată care conţine un formular HTML ce include controale.

A Busy Box

Text Box:

My name

Password Box:

************

Text Area:

My address

Check Boxes:

Breakfast

Lunch

Dinner

Radio Buttons:

French

Italian

Russian

Select

Cheese

Extra Cheese

Pepperoni

Sausage

Send the Data

</figura 3-1>

4. Când scriptul de prelucrare p-3-2.php este executat, afişează un raport amănunţit cu privire la starea serverului PHP. În secţiunea intitulată „Variabile PHP”, puteţi găsi infor­maţii cu privire la valorile variabilelor folosite în formular, aşa cum se poate vedea în figura 3-2.

<figura 3-2>

Valorile câmpurilor trimise serverului de către caseta aglomerată care conţine un formular HTML ce include controale.

PHP Variables

<Variable> PHP_SELF</Variable> <Value> /~bmccarty/php/module-03/project-3-2a.php</value>

<Variable>HTTP_POST_VARS[“textbox”] </Variable><value>my name</value>

<Variable>HTTP_POST_VARS[“passwordbox”]</Variable><value>my password</value>

<Variable>HTTP_POST_VARS[“textarea”]</Variable><value>my address</value>

<Variable>HTTP_POST_VARS[“breakfast”]</Variable><value>on</value>

<Variable>HTTP_POST_VARS[“radiobutton”]</Variable><value> frenck</value>

<Variable>HTTP_POST_VARS[“select”]</Variable><value>Array[0] cheese [1] pepperoni </value>

<Variable>HTTP_POST_VARS[“treasure”]</Variable><value> inestimable</value>

</figura 3-2>

5. Acum, când puteţi vedea care este modul de funcţionare a programului HTML original, modificaţi-l pentru a determina efectul diferitelor atribute si valori. De exemplu, eliminaţi atributul MULTIPLE din selecţie şi încercaţi să alegeţi mai multe garnituri pentru pizza. Pentru ca modificările aduse programului HTML să fie vizibile în browserul dumnea­voastră, nu uitaţi să actualizaţi pagina după ce aţi modificat-o şi aţi încărcat-o în server.

Alte noţiuni referitoare la expedierea unui formular

In secţiunile anterioare ale acestui modul, aţi învăţat modul de creare a formularelor HTML care pot trimite date unui server. In această secţiune, veţi învăţa mai multe despre procesul de expediere a formularelor. In particular, veţi învăţa să folosiţi o imagine în locul unui buton de expediere, să creaţi un buton de reiniţializare, să creaţi o pagină care conţine mai multe formulare si să transferaţi informaţii unui script prin intermediul adresei URL a scriptului.

53

Utilizarea unei imagini pentru expedierea datelor

Aspectul unui buton de expediere este monoton şi obişnuit. Dacă aspectul paginii dumneavoastră este important, puteţi folosi o imagine în locul unui buton de expediere. O asemenea imagine se numeşte, uneori, buton imagine. Când un utilizator execută clic pe un buton imagine, datele din formular sunt trimise serverului, ca şi cum utilizatorul ar fi executat clic pe un buton de expediere.

Pentru a crea un buton imagine folosiţi următoarea sintaxă:

<INPUT TYPE=”IMAGE” src=”/url” NAME=”text” ALIGN=”aliniere”>

Atributele SRC şi TYPE sunt obligatorii; celelalte atribute sunt opţionale. Atributul SRC determină adresa URL a fişierului care conţine imaginea ce va fi afişată. Atributul NAME atribuie un nume controlului de tip buton imagine. Atributul ALIGN poate lua oricare din valorile top (sus), middle (la mijloc) sau bottom (jos) şi specifică modul de aliniere a butonului imagine relativ la textul înconjurător.

<Sugestie>

Proiectul dat la sfârşitul acestei secţiuni include un buton imagine. Efectuaţi acest proiect, pentru a vă familiariza cu aspectul şi modul de comportare a butoanelor imagine.</sugestie>

54

Crearea unui buton de reiniţializare

Uneori, este folositor ca utilizatorul să poată executa clic pe un buton care să şteargă toate informaţiile incluse într-un formular. Un asemenea buton se numeşte buton de reiniţializare. Pentru a crea un buton de reiniţializare, folosiţi următoarea sintaxă:

<INPUT TYPE=”RESET” VALUE=”text”>

Unicul atribut obligatoriu este TYPE. Atributul opţional VALUE specifică textul care va apărea pe suprafaţa butonului de reiniţializare; dacă atributul este omis, pe buton va scrie „Reset”.

Crearea unei pagini care conţine mai multe formulare

Aşa cum s-a arătat, puteţi include mai multe formulare într-o singură pagină HTML. Fiecare formular trebuie să-şi aibă propriul său buton sau propria sa ima­gine pentru expedierea datelor. Un buton de reiniţializare din cadrul unui formular se aplică numai formularului care îl conţine.

Iată un exemplu de pagină care conţine mai multe formulare:

<HTML>

<HEAD>

<TITLE>O pagină cu mai multe formulare</TITLE>

</HEAD>

<BODY>

55

<!–Primul formular – >

<FORM METHOD=”POST”

ACTION=”procesare-formular-client.php”>

<BR>Numele clientului:

<BR>INPUT TYPE =”TEXT” NAME=”nume_client”>

<BR><INPUT TYPE=”SUBMIT”

VALUE=”Trimite formularul clientului”>

</FORM>

<!– Al doilea formular – >

<FORM METHOD=”POST”

ACTION=”procesare-formular-furnizor.php”>

<BR>Numele furnizorului:

<BR>INPUT TYPE =”TEXT” NAME=”nume_furnizor”>

<BR><INPUT TYPE=”SUBMIT”

VALUE=”Trimite formularul furnizorului”>

</FORM>

</BODY>

</HTML>

Pagina conţine două formulare: unul pentru expedierea informaţiilor aferente clientului şi altul pentru expedierea informaţiilor referitoare la furnizor. Fiecare formular îşi are propriul său buton de expediere. În funcţie de butonul de expediere pe care s-a executat clic, la server va fi trimis, în vederea prelucrării, numele unui client sau al unui furnizor.

În acest exemplu, fiecare formular dispune de propriul său script de prelucrare. Cu toate acestea, se poate folosi un singur script pentru prelucrarea datelor prove­nite de la fiecare formular. Un asemenea script poate determina dacă lucrează cu un formular de client sau cu unul de furnizor, în funcţie de câmpurile şi valorile pe care le primeşte.

Utilizarea unei legături pentru a furniza date unui script

In afară de a expedia unui script datele dintr-un formular prin intermediul câmpurilor din formular, puteţi expedia date cu ajutorul adresei URL a scriptului, aşa cum se specifică în atributul ACTION al etichetei FORM. Pentru aceasta, ataşaţi la sfârşitul adresei URL un semn al întrebării (?) şi apoi includeţi o serie de perechi nume-valoare cu următoarea formă:

nume1=valoare1&nume2=valoare2&nume3=valoare3

Exemplul include numai trei perechi nume-valoare; cu toate acestea, puteţi include oricâte asemenea perechi doriţi, în funcţie de limita impusă de browserul utilizatorului.

56

<Sfatul specialistului>

Întrebare: Dacă doresc să trimit unui script, prin intermediul adresei sale URL, caractere speciale precum un semn al întrebării, un semn egal sau un ampersand? Nu se creează confuzie în acest mod?

Răspuns: Da. Pentru a funcţiona corect, un şir trebuie să fie codificat URL. Pentru a codifica URL un şir care conţine o interogare, caracterele speciale se înlocuiesc cu echivalentele lor hexazecimale, precedate de un simbol procent (%). Pentru detalii, consultaţi documentul Request for Comments (RFC) 1738, dispo­nibil la adresa www.rfc.net. Unele dintre cele comune caractere speciale şi echiva­lentele lor codificate URL sunt prezentate în tabelul 3-1.

De exemplu, forma codificată URL a şirului „la mulţi ani!” este %22la mulţi ani%21%22.</sfatul specialistului>

Adresa URL rezultantă se numeşte şir de interogare şi nu poate conţine spaţii. Dacă doriţi să trimiteţi un spaţiu ca parte a unui şir de interogare, trimiteţi în locul spaţiului un semn plus (+). Iată un exemplu de şir de interogare care codifică numele autorului acestei cărţi:

http://www.osborne.com/search.cgi?author=Bill+McCarty

<tabelul 3-1>Codificările URL ale caracterelor speciale frecvent utilizate

*Caracter special

*Echivalent codificat URL

*.

*%2e

*?

*%3e

*^

*%5e

*~

*%7e

*+

*%2b

*`

*%2c

*/

*%2f

*:

*%3a

*;

*%3b

*<

*%3c

*=

*%3d

*>

*%3e

*[

*%5b

*\

*%5c

*]

*%5d

*-

*%5f

*{

*%7b

*|

*%7c

*}

*%7d

*tab

*%09

*Spaţiu

*%20

*!

*%21

57

*“

*%22

*#

*%23

*$

*%24

*%

*%25

*&

*%26

*`

*%27

*(

*%28

*)

*%29

*@

*%40

*`

*%60

</tabelul 3-1>

<Test „la minut”>

• Scrieţi un program HTML care creează un buton imagine cu numele „Start!”

• Scrieţi un program HTML care creează un buton de iniţializare cu numele „Reluare de la început”.

• Scrieţi un şir de interogare care trimite variabila culoare şi valoarea roşu serverului de la adresa www.osborne.com/test. </Test „la minut”>

Proiect 3-3: O pagină HTML care conţine mai multe formulare

În cadrul acestui proiect, veţi crea o pagină HTML care conţine două formulare. Un formular are un buton de expediere, iar celălalt are un buton imagine. Ambele formulare dispun de butoane de reiniţializare. Valorile atributelor ACTION ale celor două formulare includ şiruri de interogare codificate URL trimise serverului în momentul expedierii formularului.

Scopurile proiectului

• Dobândirea de experienţă în crearea şi utilizarea paginilor care conţin mai multe formulare

• Prezentarea aspectului şi a comportamentului butoanelor imagine şi a butoanelor de reiniţializare

• Prezentarea şirurilor de interogare

Pas cu pas

1. Plasaţi următorul script PHP într-un fişier denumit p-3-3.php şi încărcaţi acest fişier pe serverul dumneavoastră PHP:

<?php

// Fişierul p-3-3.php

phpinfo()

?>

<Notă>

Răspunsuri la test:

• <INPUT TYPE=”IMAGE” src=”/xxx” NAME=”Start!”>

• <INPUT TYPE=”RESET” VALUE=”Reluare de la început”>

• http://www.osborne.com/test/?culoare=rosu </notă>

58

2. Plasaţi următoarea pagină HTML într-un fişier denumit p-3-3.html si încărcaţi acest fişier în serverul dumneavoastră PHP, plasându-l în acelaşi catalog ca şi fişierul p-3-2.php:

<HTML>

<HEAD>

<TITLE>Alte detalii despre expedierea formularelor</TITLE>

</HEAD>

<BODY>

<!–Fişierul p-3-3.html –>

<H3>Alte detalii despre expedierea formularelor</H3>

<FORM METHOD=”POST”

ACTION=p-3-3.php?module=3&project=3”>

<BR>Numele clientului:

<BR><INPUT TYPE=”TEXT” NAME=”NUMELE_CLIENTULUI”>

<BR>

<BR><INPUT TYPE=”RESET” VALUE=”Şterge datele din formular”>

<BR>

<BR><INPUT TYPE=”SUBMIT” VALUE=”Trimite formularul”>

</FORM>

<HR>

<FORM METHOD=”POST” ACTION=p-3-3.php”>

<BR>Numele furnizorului

<BR><INPUT TYPE=”TEXT” NAME=”numele_furnizorului”>

<BR>

<BR><INPUT TYPE=”RESET” VALUE=”Şterge formularul”>

<BR>

<BR><INPUT TYPE=”IMAGE” src=”button.gif”>

</FORM>

</BODY>

</HTML>

Apoi, descărcaţi fişierul button.gif din situl Web aferent acestei cărţi si încărcaţi-l în serverul dumneavoastră PHP, plasându-l în acelaşi catalog ca şi scriptul PHP si fişierul HTML.

3. Orientaţi un browser Web spre adresa URL a fişierului care conţine formularul HTML. Browserul dumneavoastră va afişa date asemănătoare celor prezentate în figura 3-3. Completaţi ambele câmpuri text şi executaţi clic pe unul din butoanele de reiniţializare (Clear the Form). Remarcaţi că butonul de reiniţializare şterge numai câmpurile din formularul care conţine butonul respectiv.

4. Executaţi clic pe butonul de expediere. Browserul dumneavoastră trebuie să afişeze ceva similar cu ilustraţia prezentată în figura 3-4.

5. Observaţi modul în care perechile nume-valoare din şirul de interogare apar în lista variabilelor PHP, alături de valoarea cuprinsă în caseta cu text.

6. Folosiţi butonul Back al browserului pentru a reveni la pagina cu mai multe formulare. Executaţi clic pe butonul imagine. Reţineţi diferenţele dintre ilustraţia afişată de browser si cea prezentată în figura 3-4. Remarcaţi modul în care un script PHP poate executa prelucrarea mai multor formulare, prin examinarea variabilelor şi a valorilor acestora?

59

<figura 3-3> Pagina care conţine mai multe formulare

More on Suhmithng Fofms – Microsoft Internet Explorer

More on Submitting Forms

Customer Name: Joe Customer

<buton> Clear the Form</buton>

<buton>Submit the Form</buton>

Supplier Name: Jane Supplier

<buton> Clear the Form</buton>

<buton negru> This is an image Button: Click it</buton negru>

</figura 3-3>

<figura 3-4>Valorile câmpurilor trimise serverului de către pagina care conţine mai multe formulare.

Microsoft Internet Explorer

PHP Variables

<Variable> PHP_SELF</Variable><value>/~bmccarty/php/module-03/project-3-3a.php</value>

<Variable> HTTP_GET_VARS[„module”]</Variable><value>3</value>

<Variable> HTTP_GET_VARS[„project”]</Variable><value>3</value>

<Variable> HTTP_POST_VARS[„customer_name”]</Variable><value>Joe Customer</value>

</figura 3-4>

60

<Test de evaluare>

1. Scrieţi o etichetă HTML FORM care îşi trimite datele unui script situat la adresa http://www.osborne.com/cgi-bin/test.

2. Scrieţi un program HTML care creează un control cu mai multe linii, denumit adresa, pentru introducere de text. Controlul trebuie să poată conţine 5 rânduri a 80 de caractere fiecare.

3. Scrieţi un program HTML care creează un meniu derulant denumit culoare, care conţine principalele culori substractive, în speţă roşu, galben şi albastru. Faceţi de aşa manieră încât meniul să accepte o singură selecţie. Specificaţi culoarea roşie ca opţiune prestabilită.

4. Scrieţi un program HTML pentru crearea unui set de butoane radio denumite dimensiune, care permit utilizatorului să aleagă din următoarele valori: mic, mediu şi mare.

5. Scrieri un program HTML pentru crearea unui formular care îşi trimite datele la adresa www.dev.null. Formularul trebuie să conţină un câmp ascuns denumit script, care contine meniul cu valori.

Eticheta:

Comentariile sunt inchise

Ne pare rau, dar nu poti lasa un comentariu pentru acest post.

Resurse web design