Capitolul 10 Formulare

Size: px

Start display at page:

Download "Capitolul 10 Formulare"

Bonnie Maria Ryan
6 years ago
Views:

1 Capitolul 10 Formulare Utilizarea formularelor Formularul este un instrument cu ajutorul cruia din documentul HTML se realizeaz transmiterea unor informaii structurate o adres exterioar, fixat apriori. Informaia primit pe aceast adres este apoi prelucrat (de cele mai multe ori în regim automat de programe soft speciale) Formularele ocup un compartiment aparte în limbajul HTML, cel puin din motivul, c utilizarea eficient a lor cere &i cuno&tine din domeniul programrii. Crearea unei forme este mult mai simpl decât crearea sistemelor de prelucrare a datelor transmise prin forme. De cele mai multe ori adresa exterioar (la care este transmis informaia din form) prezint un program scris în Limbajele PERL, JAVA, C. Programele de acest tip sunt numite CGIscripturi, de la (Common Gateways Interface), ce se traduce ca "Interfa comun de ecluze". De cele mai multe ori scrierea programelor CGIcere o cunoa&tere bun a limbajelor respective &i a particularitilor sistemului operaional UNIX. O metod mai simpl de prelucrare a formularelor este utilizarea instruciunilor limbajului specializat PHP/FI, care se includ direct în documentele HTML. În acest caz documentele capt extensiunea *.pht sau *.php. Formularele transmit datele pentru sistemele de prelucrare în form de perechi [nume variabil]=[valoare variabil]. Numele variabilelor sunt date cu litere ale alfabetului englez. Valorile variabilelor, indiferent de coninutul lor, sunt prelucrate de sistem ca variabile de tip &ir de caractere (string). Structura formularelor Formularele sunt marcate de perechea de taguri <FORM>... </FORM>. Este permis utilizarea mai multor formulare într-un 54

2 singur document HTML, dar nu sunt permise formularele incluse (formular în formular). În interiorul formularelor este permis utilizarea fragmentelor de text HTML, inclusiv taguri. Tagul <FORM> poate fi completat cu trei atribute, unul dintre ele fiind obligatoriu: ACTION Atribut obligatoriu. Localizeaz sistemul de prelucrare a formei METHOD Determin modul de transmitere (protocolul de transmitere a hipertextului) a datelor din formular la sistemul de prelucrare. Valori permise: METHOD=POST &i METHOD=GET. dac nu se fixeaz valoarea, se atribuie METHOD=GET. ENCTYPE Determit standardul de codificare a datelor pentru transmitere la sistemul de prelucrare. Dac valoarea atributului nu este fixat, se consider c valoarea e ENCTYPE=application/x-www-form-urlencoded. Formulare elementare. Procesul de completare a datelor din formular este logic urmat de instruciunea de iniializare a transmiterii datelor: <INPUT TYPE=submit> Efectul utilizrii acestui tag este apariia în documentul HTML a butonului cu inscripia Submit ( subscrie ), la activarea creia toate datele din formular vor fi transmise sistemei de prelucrare, indicate în <FORM>. Inscripia de pe buton poate fi modificat prin introducerea în tag a atributului VALUE="[text]" (valoare), de exemplu: <INPUT TYPE=submit VALUE="Hopa Hop!"> 55

3 Folosind datele acumulate, putem forma un formular elementar Exemplul 10.1 <HTML> <HEAD> <TITLE>Exemplul 10.1</TITLE> </HEAD> <H1>Un formular elementar </H1> <FORM ACTION="tabel2.html">  <INPUT TYPE=submit VALUE="La tabele, la tabele!..."> </FORM>  </BODY> </HTML> Inscripia asociat butonului poate fi transmis prin includerea în descrierea butonului a atributului NAME=[nume], de exemplu: <INPUT TYPE=submit NAME=button VALUE="Apasa repede"> Forma poate conine mai multe butoane cu nume &i valori diferite. Astfel, sistemul de prelucrare a formelor poate realiza unele sau alte aciuni, în dependen de butoanele activate de utilizator. Acumularea datelor d" c"tre formular Exist mai multe tipuri de elemente <INPUT>. Fiecare element <INPUT> conine atributul obligatoriu NAME=[nume], care determin numele elementului (&i, corespunztor, numele variabilei, care va fi transmis sistemului de prelucrare). Numele va conine doar semne ale alfabetului latin, fr semne diacritice. Un alt atribut al tagului <INPUT> este VALUE="[valoare]", care determin valoarea ce va fi transmis sistemului de prelucrare. Acest atribut nu este obligatoriu pentru elementele <INPUT TYPE=text> &i <INPUT TYPE=password>, deoarece în aceste cazuri vizualizarea nu se realizeaz direct. Atribute utilizate cu tagul <INPUT>: 56

4 TYPE=text Determin o fereastr pentru introducerea textului. Poate conine atribute suplimentare SIZE=[numr] (limea ferestrei de introducere în simboluri) &i MAXLENGTH=[numr] (lungimea maxim admis pentru rândul de simboluri). Exemplu: <INPUT TYPE=text SIZE=20 NAME=user VALUE="Scrie textul aici"> Define&te o fereastr cu limea de 20 simboluri pentru introducerea textului. La momentul apariiei ferestrei în ea se afi&eaz textul "Scrie textul aici", care mai apoi poate fe redactatulterior textul (redactat sau predefinit) va fi transmis la sistemul de prelucrare prin variabila user. TYPE=password Define&te o fereastr pentru introducerea parolei. Efectul este acela&i, unica deosebire este c pe ecran în locul simbolurilor introduse apar (*). Exemplu: <INPUT TYPE=password NAME=pw SIZE=20 MAXLENGTH=10> Define&te o fereastr pentru introducerea parolei cu o lungime de 20 simboluri. Numrul de simboluri în parol nu poate dep&i 10. Parola introdus este transmis sistemului de prelucrare prin variabila pw. TYPE=radio Define&te un buton radio. Poate conine atributul suplimentar checked (indic dac butonul este selectat). În un grup de butoane radio cu nume identice poate fi doar un buton selectat Exemplu: <INPUT TYPE=radio NAME=modem VALUE="9600" checked> 9600 bit/s <INPUT TYPE=radio NAME=modem VALUE="14400"> bit/s <INPUT TYPE=radio NAME=modem VALUE="28800"> bit/s Define&te un grup din trei butoane radio, marcate 9600 bit/s, bit/s &i bit/s. La apariia grupului de butoane pe pagin, va fi marcat primul din ele. Dac utilizatorul nu va selecta alt buton, 57

5 sistemului de prelucrare i se va transmite variabila modem cu valoarea Dac se selecteaz unul din butoanele iniial inactive se va transmite valoarea corespunztoare butonului ales TYPE=checkbox Define&te un box, care poate fi bifat. Ca &i atributul precedent (radio) poate conine atributul suplimentar checked (bifarea apriori a boxului). Spre deosebire de butoanele radio, în grupul de boxuri pot exista mai multe elemente bifate apriori. Exemplu: <INPUT TYPE=checkbox NAME=comp VALUE="PC"> Staii terminale <INPUT TYPE=checkbox NAME=comp VALUE="WS" checked> Statii de lucru <INPUT TYPE=checkbox NAME=comp VALUE="LAN"> Server al reelei Intrenet <INPUT TYPE=checkbox NAME=comp VALUE="IS" checked> Servere Internet Define&te un box din patru elemente. Sunt marcate elementele 2 &i 4. Dac nu vor fi bifate alte butoane sau demarcate butoanele 2 &i 4, sistemul de prelucrare va primi variabila comp=ws &i comp=is. TYPE=hidden Define&te un element invizibil pentru utilizator. elementul nu se modific în procesul de completare a formei &i serve&te în calitate de resurs informaional doar pentru sistemul de prelucrare, de exemplu în situaiile cînd structura formei se modific în timp, pentru determinarea versiunii formei. Exemplu: <INPUT TYPE=hidden NAME=version VALUE="1.1"> Define&te variabila ascuns version, care se transmite sistemei de prelucrare valoarea

6 TYPE=reset Define&te butonul, activarea cruia reseteaz coninutul formei fr a transmite datele sistemului de prelucrare. Spre deosebire de alte atribute, se poate lipsi de atributul name. Exemplu: <INPUT TYPE=reset VALUE="Resetarea coninutului formei"> În afar de elementele <INPUT>, mai pot fi utilizate elementele <SELECT> &i <TEXTAREA>. Meniul <SELECT> din n elemente are forma: <SELECT NAME="[nume]"> <OPTION VALUE="[valoare 1]">[text 1] <OPTION VALUE="[valoare 2]">[text 2]... <OPTION VALUE="[valoare n]">[text n] </SELECT> Meniul începe cu tagul <SELECT> &i sfîr&e&te cu </SELECT>. Tagul <SELECT> conine atributul obligatoriu NAME, care define&te variabila generat de meniu. Tagul<SELECT> poate conine &i atributul MULTIPLE, care permite selectarea concomitent a cîtorva elemente din meniu. Majoritatea sistemelor de navigare prezint meniul <SELECT MULTIPLE> în forma unei ferestre (înlimea ferestrei în linii este determinat de atributul suplimentar SIZE=[numr]). Meniul <SELECT> apare ca un meniu derulant vertical. Tagul <OPTION> define&te un element al meniului. Atributul obligatoriu VALUE define&te valoarea, care va fi transmis sistemului de prelucrare, dac a fost ales elementul corspunztor al meniului. Tagul <OPTION> poate conine atributul checked, care fixeaz c elementul este predefinit marcat. 59

7 Vom cerceta exemplul. <SELECT NAME="selection"> <OPTION VALUE="option1" checked>variantul 1 <OPTION VALUE="option2"> Variantul 2 <OPTION VALUE="option3"> Variantul 3 </SELECT> Fragmentul define&teun meniu din trei elemente: Variantul 1, Variantul 2 &i Variantul 3. Este preselectat elementul Variantul 1. sistemei de prelucrare i se va transmite variabila selection cu valoarea option1 (predefinit), option2 sau option3. Destul de simpl este &i utilizarea tagului <TEXTAREA> <TEXTAREA NAME=address ROWS=5 COLS=50> Introducai aici adresa... </TEXTAREA> Atributele sunt obligatorii. NAME define&te numele variabilei prin care informaia se transmite sistemului de prelucrare, (address). ROWS define&te înlimea ferestrei în linii (5). COLS define&te limea ferestrei în simboluri (50). Textul plasat între <TEXTAREA> &i </TEXTAREA>, este inclus automat în fereastra de text. El poate fi redactat sau lichidat de ctre utilizator. Exemplul 10.2: <HTML> <HEAD> <TITLE>Exemplul 10.2</TITLE> </HEAD> <H1>Un formular... simplu de tot </H1> <FORM ACTION="adresa calculatorului pe care se afla sistemul de prelucrare" METHOD=post> 60

8 <H2>Unele date biografice...</h2> <P>Datele pot fi inventate </P> <P>Nume:&nbsp &nbsp &nbsp<input TYPE=text SIZE=40 NAME=fn><BR> Prenume: <INPUT TYPE=text SIZE=40 NAME=ln><BR> Sex: <INPUT TYPE=radio NAME=gender VALUE="male" checked>masculin <INPUT TYPE=radio NAME=gender VALUE="female">feminin<BR> Virsta: <INPUT TYPE=text SIZE=5 NAME=age> ani<br> <INPUT TYPE=submit VALUE="Transmiteti formularul"> </P> </FORM> </BODY> </HTML> FORMULARE prin po.te electronic" Pentru utilizatorii începtori, care nu posed deprinderi de scriere a sistemelor de prelucrare formularele prezint, la prima vedere, un instrument inutil. Totu&i, exist situaii, în care utilizarea lor este motivat. Astfel, dac în calitate de aciune a formularului vom indica adresa cutiei po&tale &i modul de codificare a datelor, coninutul formei va fi trimis în cutia po&tal indicat, iar mai apoi prelucrat manual. <FORM ACTION=mailto:user@mail.box ENCTYPE=text/plain> Crearea formelor este un pas spre trecerea le elementele de DHTML (Dynamic HTML) limbaj, care permite prelucrarea datelor direct în document, fr a trimite informaia în afar. Acest tip de forme este utilizat pentru generarea diferitor tipuri de teste. 61

2. Setări configurare acces la o cameră web conectată într-un router ZTE H218N sau H298N

2. Setări configurare acces la o cameră web conectată într-un router ZTE H218N sau H298N Pentru a putea vizualiza imaginile unei camere web IP conectată într-un router ZTE H218N sau H298N, este necesară activarea serviciului Dinamic DNS oferit de RCS&RDS, precum și efectuarea unor setări pe