You are on page 1of 186

IOAN FILIP

PROGRAMARE WEB
- suport de curs -

EDITURA

CONSPRESS

2013

Copyright 2013, Editura Conspress


EDITURA CONSPRESS
este recunoscut de
Consiliul Naional al Cercetrii tiinifice din nvmntul Superior

Lucrare elaborat n cadrul proiectului: "Reea naional de centre pentru


dezvoltarea programelor de studii cu rute flexibile i a unor instrumente
didactice la specializarea de licen i masterat, din domeniul Ingineria
Sistemelor"

Descrierea CIP a Bibliotecii Naionale a Romniei


FILIP, IOAN
Programare WEB : supot de curs / Ioan Filip Bucureti :
Conspress, 2013
Bibliogr.
ISBN 978-973-100-263-7
004
Colecia Carte universitar

CONSPRESS
B-dul Lacul Tei nr 124, sector 2
cod 020396, Bucureti
Tel: (021) 242 2719 / 300; Fax: (021) 242 0781

CUVNT NAINTE
Prezenta lucrare se constituie ca suport de curs aferent disciplinei
Programarea aplicaiilor Internet, fiind destinat studenilor anului 3, respectiv 4
domeniul Ingineria Sistemelor, din cadrul Facultii de Automatic i Calculatoare,
Universitatea Politehnica din Timioara.
Prin coninut i maniera de prezentare, prin setul generos de exemplificri
bine documentate, lucrarea poate fi de un real folos oricrui cititor interesant de
domeniu, ct i programatorilor lucrnd la dezvoltarea de aplicaii Web.
Pe parcursul a trei capitole, sunt tratate att sub aspect teoretic, ct i mai
ales aplicativ, cele mai relevante problematici (n opinia autorului) cu care se poate
ntlni n mod uzual un programator care utilizeaz suita de limbaje i tehnologii
selectate ca suport de implementare: HTML, PHP, MySQL, JavaScript, AJAX.
Alegerea acestei suite, dintr-o gam extrem de variat de alte limbaje i tehnologii
de programare Web, ofer cititorului o ampl imagine asupra procesului de
dezvoltare a aplicaiilor Internet, respectiv o prezentare tehnic a unui set complet
de limbaje i instrumente software destinate finalizrii acestui proces printr-un
produs end-user: un site Web complet funcional i livrabil clientului.
Lucrarea a fost elaborata n cadrul proiectului Reea naional de centre
pentru dezvoltarea programelor de studii cu rute flexibile i a unor instrumente
didactice la specializarea de licen i masterat, din domeniul Ingineria Sistemelor,
finanat prin Programul Operaional Sectorial pentru Dezvoltarea Resursei Umane
POSDRU (POSDRU/86/1.2/S/63806).

Timioara, februarie 2013


Prof.dr.ing. Ioan Filip

Cuprins 5

CUPRINS
INTRODUCERE .................................................................................. 9
1. HTML ............................................................................................. 11
1.1. Introducere ............................................................................................................... 11
1.2. Etichete HTML .......................................................................................................... 12
1.2.1. Etichete primare ............................................................................................ 12
1.2.2. Setarea unui fundal al paginii .................................................................. 13
1.2.3. Formatare text ............................................................................................... 14
1.2.4. Inserarea unei imagini ................................................................................ 16
1.2.5. Hiperlegturi ................................................................................................... 16
1.2.6. Formulare. Metodele GET i POST .......................................................... 17
1.3. Frame-uri .................................................................................................................... 22
1.3.1. Frame-uri linie/coloan ............................................................................... 22
1.3.2. Frame-uri ncuibate ...................................................................................... 23
1.3.3. Atribute ale frame-urilor ............................................................................ 25
1.3.4. Frame-uri legate ............................................................................................ 26
1.4. Tabele ........................................................................................................................... 28
1.4.1. Elemente introductive ................................................................................. 28
1.4.2. Controlul global al unui tabel.................................................................... 29
1.4.3. Controlul unei celule .................................................................................... 29
1.4.4. Combinarea celulelor ................................................................................... 30
1.4.5. Formatarea coloanelor ................................................................................ 31
1.4.6. Fundal i margini tabel ............................................................................. 32
1.5. Liste ............................................................................................................................... 34
1.5.1. Liste neordonate ............................................................................................ 34
1.5.2. Liste ordonate................................................................................................. 34
1.5.3. Alte tipuri de liste .......................................................................................... 35
1.6. Mapri pe imagini .................................................................................................. 36
1.7. Dinamic i multimedia. HTML 5 .................................................................. 37
1.8. Elemente CSS ........................................................................................................... 39
1.8.1. Stiluri interne .................................................................................................. 39
1.8.2. Stiluri externe ................................................................................................. 41

1.8.3. Stiluri n linie ................................................................................................... 42


1.8.4. Clase CSS ......................................................................................................... 43
1.8.5. Meniuri create cu CSS ................................................................................. 44

2. PHP ................................................................................................ 51
2.1. Preliminarii ................................................................................................................ 51
2.2. Instalare ...................................................................................................................... 52
2.3. Comenzi PHP ............................................................................................................. 53
2.3.1. Sintax i elemente de baz ......................................................................... 53
2.3.2. Tipuri de date ...................................................................................................... 56
2.3.3. Structuri condiionale i de ciclare .............................................................. 58
2.4. Dezvoltare de aplicaii PHP cu baze de date MySQL ......................... 61
2.4.1. Funcii PHP pentru operare cu MySQL ....................................................... 61
2.4.2. Elemente MySQL ................................................................................................ 65
2.4.3. Interogare neparametrizat a unei tabele a bazei de date ............... 66
2.4.4. Interogare parametrizat a unei tabele a bazei de date .................... 73
2.4.5. Adugare ntr-o tabel a bazei de date ..................................................... 83
2.4.6. tergere cu confirmare dintr-o tabel a bazei de date ....................... 86
2.4.7. Modificarea unei linii dintr-o tabel a bazei de date ............................ 89
2.4.8. Aplicaie exemplu cu operaii SQL multiple ............................................. 93
2.4.9. Interogare cu extragerea date dintr-o coloan BLOB .......................... 96
2.4.10. Apelul unei proceduri stocate ..................................................................... 98
2.4.11. Prevenirea problemei SQL injection ......................................................... 99
2.5. Dezvoltare de aplicaii PHP cu baze de date Oracle ........................ 104
2.5.1. Interogare fr parametri ............................................................................. 104
2.5.2. Operare tranzacional .................................................................................. 106
2.5.3. Interogare cu parametri pasai prin auto-apelare............................... 108
2.6. Dezvoltare de aplicaii PHP cu baze de date Interbase ................ 111
2.7. Grafic ........................................................................................................................ 113
2.8. Funcii pentru operare cu fiiere ................................................................ 117
2.9. Operare cu sesiuni .............................................................................................. 121
2.10. Operare cu cookies........................................................................................... 124
2.11. Transferuri de parametri .............................................................................. 125
2.11.1. Selecii multiple.............................................................................................. 125

Cuprins 7

2.11.2. Comenzi pentru transferul unor parametri speciali .......................... 127


2.11.3. Transfer UPLOAD ........................................................................................... 128
2.11.4. Variabile cu nume construite dinamic ................................................... 130
2.12. Informaii sistem .............................................................................................. 131
2.12.1. Informaii asupra datei i timpului curent ........................................... 131
2.12.2. Informaii privind accesul client............................................................... 132
2.12.3. Generare e-mail ............................................................................................. 133
2.13. Servicii Web cu PHP......................................................................................... 133
2.14. Programare PHP orientat pe obiecte .................................................. 136

3. ELEMENTE JAVASCRIPT I AJAX ...................................... 143


3.1. JavaScript ................................................................................................................. 143
3.1.1. Elemente introductive JavaScript .............................................................. 143
3.1.2. Validare date numerice de intrare ............................................................. 144
3.1.3. Validare coninut casete INPUT .................................................................. 145
3.1.4. Aplicaie de mapare pe o imagine ............................................................. 148
3.1.5. Transfer de informaie ntre HTML i JavaScript .................................. 152
3.1.5.1. Citire valori etichete INPUT n variabile JavaScript .................. 152
3.1.5.2. Setare atribute etichete HTML cu coninut variabile JavaScript
........................................................................................................................................ 154
3.2. AJAX ............................................................................................................................. 157
3.2.1. Introducere n AJAX - comparaie cu tehnologia tradiional ......... 157
3.2.2. PHP cu AJAX ....................................................................................................... 159
3.2.2.1. Utilizare obiect XMLHttpRequest ....................................................... 159
3.2.2.2. Grafic dinamic cu AJAX .................................................................... 162
3.2.3. AJAX, PHP i MySQL aplicaii ................................................................... 166
3.2.3.1. Preliminarii ............................................................................................... 166
3.2.3.2. Interogare cu actualizarea unei zone de afiare DIV ............... 168
3.2.3.3. Interogare parametrizat a unei tabele MySQL ......................... 172
3.2.3.4. Rencrcare dinamic a etichetelor SELECT aplicaie de
filtrare ........................................................................................................................... 175
Bibliografie ........................................................................................................................ 181

Introducere 9

INTRODUCERE
Programarea Web se constituie astzi, n contextul exploziei informaionale
i a extinderii de neimaginat acum civa ani a reelei Internet, ca unul dintre
domeniile dezvoltrii de aplicaii software cu un trend permanent ascendent, ntr-o
continu evoluie, att calitativ, ct i cantitativ. Practic, un important segment al
dezvoltrilor informatice este acaparat de proiectarea i dezvoltarea de aplicaii
destinate Internetului, categoria Web fiind predominant n acest sens.
Punctul de start al prezentei lucrri l constituie o carte mai veche a autorului
Tehnologii de programare a aplicaiilor Internet cu baze de date [1], elaborat ca
suport de curs destinat disciplinei Programarea aplicaiilor Internet aferent
curriculei de studiu a anului 4 Ingineria Sistemelor. Prin modificrile i adaptrile
operate, prin subiectele revizuite i tematicile noi integrate, att la nivel teoretic, ct
i mai ales aplicativ, prin paragrafele suplimentare i capitolul complet nou adugat,
cartea de fa reprezint mult mai mult dect o simpl nou ediie, revizuit i
adugit, fiind practic o lucrare complet nou, ancorat n noile realiti ale unui
domeniu ntr-o continu expansiune. Prin titlul ales, considerat a descrie mult mai
bune coninutul actualizat n conformitate cu noile tendine i dezvoltri din domeniu
informatic abordat, lucrarea dezvluie direct, fr echivoc, subiectul stabilit ca
obiectiv principal: programarea Web. Evident c plaja de referin a unui asemenea
obiectiv este practic imposibil de cuprins i tratat complet, n vastitatea ei, ntr-o
singur lucrare. Din acest motiv, ngustnd zona abordat (cartea constituindu-se
tot ca suport de curs destinat studenilor, dar sigur util i programatorilor), inta
principal este focalizat pe furnizarea rapid, eficace i concis, axat strict pe
utilitatea uzual, a unor informaii de maxim eficien aplicativ, destinate unei
rezolvri rapide a diverselor probleme care apar frecvent n dezvoltarea aplicaiilor
Web, uzual cerute de piaa de profil. De asemenea, din imensa gam de limbaje i
tehnologii de programare utilizate la ora actual pentru dezvoltarea i ntreinerea
vastei construcii numit Internet, lucrarea se oprete doar asupra unei suite
restrnse, oferind ns un meniu complet de instrumente software permind
proiectarea i implementarea oricrui tip de aplicaii Web cerute pe pia. Suita la
care se face referire are urmtoarele componente: HTML+CSS, PHP+MySQL
(Oracle), JavaScript+AJAX, acoperind practic ntreaga arie de problematici care se
cer a fi rezolvate la dezvoltarea unui site Web: programare server-side (PHP),
programare client-side (JavaScript), baze de date (MySQL), elemente de dinamic i
interactivitate cu utilizatorul (AJAX), formatare i design (HTML, CSS).
Abordarea subiectelor tratate este caracterizat printr-o puternic tent
aplicativ, orice secven de cod prezentat putnd fi imediat rulat, astfel nct
programatorul s dispun din start de o baz de cod iniial, funcional, imediat
utilizabil, adaptabil i extensibil conform cerinelor acestuia. De asemenea,
abordarea este gradual, fiecare nou exemplu venind ca o completare a celor
precedente, respectiv ca un pas n fa pentru rezolvarea unei alte probleme,
succesiv i logic aprute dup rezolvarea celei precedente.
Dei la ora actual exist o mulime de surse bibliografice, n special
disponibile on-line pe Internet [20][21][34][37], cititorul putnd fi copleit de
multitudinea lor, lucrarea ncerc s ofere un solid punct de start pentru o abordare
pas cu pas, pornind de la simplu spre complicat, a extrem de vastului domeniu al
programrii Web.

10

Introducere

Lucrarea este structurat pe trei capitole, nucleul de baz constituind-ul


capitolul 2 destinat programrii server-side, absolut indispensabile dezvoltrii unor
aplicaii Web cu o complexitate cel puin medie.
Capitolul 1 este destinat prezentrii limbajului de marcaje HTML, piatra de
temelie a oricrei aplicaii Web. Dei schimbrile n domeniul HTML au nregistrat o
evoluie constant, elementele de baz nu s-au schimbat n mod radical. Din acest
motiv, multe paragrafe ale lucrrii sunt doar puin modificate i revizuite fa de
lucrarea mai veche, elementele noi constnd n adugarea unor paragrafe viznd
HTML 5 (ca ultim versiune lansat pe pia, revoluionnd practic zona Web
multimedia, din pcate ns, neadoptat integral de nici o familie de browsere),
respectiv CSS (Cascading Style Sheets) - ca strategie global adoptat pentru
formatarea paginilor Web.
Capitolul 2, majoritar ca ntindere, trateaz vastul subiect al programrii
Web utiliznd limbajul PHP. Practic alegerea limbajului PHP pentru dezvoltarea unei
aplicaii Web constituie una dintre variantele principale care domin actualmente
piaa (alturi de ASP.NET, JSP, etc.), poate chiar cea mai folosit. [24] Capitolul
ncearc o prezentare a esenei utilizrii PHP pentru dezvoltarea unor site-uri Web,
n tandem cu sistemul de gestiune a bazelor de date MySQL (dar i cu Oracle,
pentru realizarea unei legturi cu disciplina Baze de date aferent domeniului
Ingineria Sistemelor), completat cu paragrafe abordnd problematici uzuale n
cadrul procesului de dezvoltare a unei aplicaii Web complexe. Departe ns de autor
ideea epuizrii acestui subiect, programarea PHP avnd ca reper i resurs
bibliografic complet, binecunoscutul site Web (manual PHP on-line)
php.net/manual/en/index.php, extrem de util, concis i ntr-o permanent
actualizare.
Obiectivul ultimului capitol l constituie realizarea unei sinteze punctnd
cteva elemente de baz privind utilizarea limbajului client-side JavaScript, inclusiv
prin abordarea AJAX, care ncearc s asigure o dinamic i interactivitate mult
sporit a paginilor Web, n tentativa de apropiere a comportamentului acestora de
cel al unei clasice aplicaii desktop.
Dup cum s-a mai precizat, diversitatea limbajelor, tehnologiilor, mediilor i
instrumentelor software utilizate la ora actual n domeniul dezvoltrii aplicaiilor
Web, face destul de dificil alegerea de ctre un programator neiniiat a unei
anumite strategii, respectiv a unui anumit suport software adecvat. n esent,
lucrarea propune cititorului o soluie n acest sens, bazat n mare pe tripleta PHPMySQL- JavaScript, oferindu-i totodat o gam extrem de diversificat de exemple
aplicative, pornind de la care, eficiena i viteza proiectrii, respectiv implementrii
unei aplicaii s fie maximizat.

1. HTML
1.1. Introducere
HTML (HyperText Markup Language) este un limbaj de marcare folosit de
browser-ele Web pentru a determina modul de afiare a coninutului paginilor Web.
[1][2] Elemente de baz ale HTML sunt o serie de cmpuri sau marcaje speciale,
numite i tag-uri sau etichete HTML. O alt caracteristic esenial a HTML o
constituie posibilitatea realizrii de legturi (link-uri sau hyperlink-uri) spre alte
documente/pagini Web, aa cum rezult i din denumirea lui (HypertText element
crend o legtur spre un alt document). Protocolul destinat comunicaiei n cadrul
WWW (Word Wide Web sau pe scurt Web) este HTTP (Hypertext Transfer Protocol),
asigurnd transferul de informaie ntre un server Web i un client browser Web. [3]
Etichetele HTML se folosesc ori de cte ori se dorete o formatare a modului de
afiare a informaiei publicate (scrierea unui text cu bold, alegerea unui anumit
fundal al paginii, inserarea unei imagini, afiare tabelat, integrare de sunet sau
orice altceva legat de formatarea unei pagini Web). Tag-urile sunt coduri speciale
care nsoesc coninutul propriu-zis al paginii Web, stabilind modul n care acesta
este afiat pe parte de client apelant. Codul HTML (mpreun cu informaia propriuzis), stocat la distan pe un server Web, este transferat spre un browser Web
(folosind HTTP), fiind interpretat corespunztor de ctre acesta. Multitudinea de
browsere Web folosite face ca modul de interpretare al unor etichete HTML s difere
uneori de la un caz la altul (din acest motiv, testarea unei aplicaii Web trebuie
realizat de multe ori pe o gam larg de browsere).
Pentru o prim exemplificare, se consider eticheta HTML <b> reprezentnd
tag-ul pentru o afiare bold a unui text. n cazul n care acest tag pereche
ncadreaz un text (vezi exemplul urmtor), afiarea textului se va realiza cu bold:
<b>Acest text este bold!</b>
Trebuie remarcat existena i a unui tag complementar </b> ataat la
sfritul coninutului textual. Acest tag de sfrit al marcajului nchide seciunea de
bold i comunic browser-ului ca formarea impus se ncheie n acest punct. Cele
mai multe tag-uri au un tag complementar de nchidere a seciunii delimitate, dup
cum se va vedea n continuare (astfel nct se poate vorbi, de regul, despre aceste
etichete ca despre nite perechi de delimitatori ai informaiei de afiat). Etichetele
HTML nu sunt case-sensitive.
HTML este independent de platform (sistem de operare), dar trebuie avut
n vedere situaia n care se apeleaz resurse ale sistemului cu particulariti diferite
de la unul la altul (spre exemplu, problema case-sensitive la referirea numelui de
fiiere pe Linux). Un document n format HTML const, n esen, ntr-o mulime de
tag-uri mpreun cu informaia util. nvarea sintaxei acestor tag-uri este
sinonim cu nvarea HTML, ca limbaj de descriere a documentelor. Totui, fr
apariia unor limbaje de programare ca Java, JavaScript, PHP, Perl, limbajul de
marcare HTML ar fi asigurat doar o simpl prezentare prozaic pe ecran a unor
texte i grafice, totul ntr-un format static, singura calitate dinamic constituind-o
posibilitatea de navigare de la o pagin la alta.
HTML, ca limbaj de marcare pentru hypertexte, ajuns momentan la
versiunea 5, prezint o evoluie continu. HTML 1.0 a introdus conceptele de antet,
paragraf, liste, referine, HTML 2.0 a adugat posibilitatea de inserare a imaginilor,

12

HTML - 1

HTML 3.0 vine cu tabele, text n jurul figurilor frame-uri iar versiunile au evoluat
succesiv, nglobnd de obicei tot ceea ce exista i aducnd n plus elemente noi.
ncepnd cu HTML 4 i continund cu actuala versiune 5 (integrnd semnificative
faciliti multimedia [7]), noi etichete sunt adugate, specificaiile altora sunt
modificate, tendina principal fiind de a apropia aspectul i funcionalitile unei
aplicaii Web de cele ale unei aplicaii desktop. [22]
Evoluia HTML continu i n momentul de fa, integrnd o serie de noi
tehnologii i plugin-uri dedicate, extinznd substanial capabilitile multimedia ale
site-urilor Web. Astfel, se vorbete despre DHTML (Dynamic HTML), reprezentnd o
combinaie ntre HTML, CSS i JavaScript, AJAX - ca o integrare HTML, JavaScript i
XML (eXtended Markup Language) i multe altele, toate acestea conducnd la o
dinamic sporit a paginilor Web. [4][5] Aceast evoluie este strns legat i de
versiunile succesive de dezvoltare a browser-elor utilizate pe pia (Netscape,
Mozilla, Microsoft Internet Explorer, Mosaic, Opera, Safari, Google Crome etc),
fiecare prelund uneori ntr-o manier personalizat noile standarde HTML (dup
cum s-a precizat deja, putndu-se vorbi de o dependen de browser, adic acelai
document HTML este interpretat n mod diferit de browsere diferite).

1.2. Etichete HTML


1.2.1. Etichete primare
n continuare sunt prezentate cteva dintre cele mai importante i uzual
folosite tag-uri (etichete) care permit crearea unei pagini Web.[1]
Sintaxa complet (dar nu obligatoriu necesar) la crearea unei simple pagini
Web coninnd doar cod HTML este urmtoarea:
<html
<head>
<title>Prima pagina HTML</title>
</head>
<body>
Continut prima pagina HTML
</body>
</html>
Pentru realizarea aplicaiei Web, trebuie deschis un editor de texte, introdus
coninutul de mai sus (salvat ntr-un fiier cu extensia .html sau .htm), iar apoi se
poate deschide (accesa) pagina astfel creat dintr-un browser. Va apare o pagin cu
fundal alb, avnd titlul "Prima pagina HTML" afiat pe bara de titlu i o linie de text
simplu afiat n zona de afiare a browser-ului, coninnd mesajul "Prima pagina
HTML". Cu bold s-au scris tag-urile folosite n aceast pagin. Se observ structura
i poziionarea acestora n cadrul documentului. O scurt descriere a rolului acestor
etichete n cadrul paginii este prezentat n tabelul 1.1.
Tabel 1.1.

<html></html>
<head></head>

Specific faptul c documentul este un document HTML.


Toate documentele ncep i se termin cu acest tag.
Creeaz o zon de informaie de tip meta, cum este cazul
titlului documentului, cuvinte cheie sau informaii care

1.2. Etichete HTML

<title></title>
<body></body>

13

descriu pagina pentru motoarele de cutare.


Creeaz un "titlu" pentru acest document. Orice este scris
n interiorul acestui tag, va fi afiat de ctre browser n bara
de titlu.
Creeaz o zon special pentru coninutul documentului
(text, imagini etc). Aceast seciune este locul unde se vor
insera toate elementele "afiabile" ale paginii.

Cel puin 99% din documentele Web, fie ele mai mici sau mai mari, mai
simple sau mai complicate, conin cel puin tag-urile prezentate mai sus. Ele descriu
cadrul general al oricrui document HTML. Din definiia tag-ului <body> se poate
vedea c cea mai mare parte din aciunea unei pagini HTML se desfoar n
aceast seciune, de vreme ce acest tag <body> cuprinde tot coninutul afiabil al
documentului. Utilizarea tag-urilor HTML este non-case-sensitive (se pot folosi att
caracter mici, ct i mari).
Observaie: Comentariile HTML sunt ncadrate de separatorii <!-- i -->:
<!--Cod HTML comentat sau simplu comentariu -->:

1.2.2. Setarea unui fundal al paginii


Una dintre primele operaii pe care cei mai muli programatori Web
nceptori doresc s l fac unei pagini de Web este adugarea unui fundal
(background), indiferent dac e vorba de un background de tip culoare sau imagine.
n mod implicit, un document fr background va fi afiat pe un fundal alb. Aceast
culoare se poate schimba foarte uor. n acest sens trebuie adugat urmtorul cod
n interiorul zonei delimitate de tag-ul <body> :
<body bgcolor="#XXXXXX">
unde xxxxxx este codul hexa al culorii dorite, sau se poate folosi chiar
numele culorii.
De exemplu, codul urmtor face ca documentul s fie afiat cu un
background de culoare roie:
<body bgcolor="#ff0000">
sau utiliznd chiar numele culorii:
<body bgcolor="red">
Cteva dintre codurile hexa pentru cele mai uzuale culori sunt prezentate n
tabelul 1.2.
Dup ce s-a descris cum se adaug un background de o anumit culoare, se
prezint modul cum se pot aduga imagini n fundal.
Folosirea fiierului imagine backgr15.jpg pe post de background (fundal),
este posibil cu ajutorul urmtoarei sintaxe:
<body background="backgr15.jpg">
Tabel 1.2.

black
white
blue
yellow
red
green

#000000
#FFFFFF
#0000FF
#FFFF00
#FF0000
#008000

14

HTML - 1
lime
silver

#00FF00
#C0C0C0

Muli autori prefer s dea documentelor lor, att o culoare de background


ct i o imagine. n acest fel, chiar dac imaginea nu a fost nc complet descarcat
de pe serverul Web, navigatorii vor vedea ntre timp culoarea de background:
<body bgcolor="#000000" background="backgr15.jpg">
Observaie: Pentru a evita apariia unor probleme datorate dependenei de sistemul
de operare n referirea unor resurse ale acestuia, fiierului imagine referit n codul
HTML trebuie s foloseasc tipul/combinaia exact de caractere -mari i/sau miciutilizat n denumirea lui ca resurs fiier gestionat de platform (problem mai
puin relevant pentru platformele Windows, dar extrem de relevant pentru Unix,
Linux).

1.2.3. Formatare text


Una dintre cele mai importante funcionaliti a limbajului HTML, integrat
chiar ncepnd cu primele versiuni, o constituie posibilitatea formatrii informaiei de
tip text, toate documentele Web coninnd cel puin o astfel de informaie primar,
ca i coninut propriu-zis. n continuare, fr a avea pretenia de a epuiza ntreg
subiectul, sunt prezentate cteva dintre tag-urile uzuale destinate stabilirii unui
format textual.
- Heading
Un heading este un text - de regul pe post de titlu/subtitlu - scris cu
caractere mai mari i ngroate, scos n eviden fa de restul coninutului paginii.
Pentru crearea lor se poate folosi eticheta <h?>, unde n loc de ? se trece un
numr de la 1 la 6 (1 corespunde celor mai mari caractere ale textului, iar 6 se scrie
pentru a obine cele mai mici caractere pentru respectivul text). Spre exemplu:

<h1>Hello!</h1>
<h2>Hello!</h2>
<h3>Hello!</h3>

- Paragraful
Un paragraf poate fi creat n HTML prin utilizarea etichetei <p>. Aceast
etichet creeaz o zon de text, care este separat de restul documentului printr-o
linie vid deasupra i dedesubtul zonei de text. De exemplu:
<p>Acesta este primul paragraf. Acesta este primul paragraf. Acesta este
primul paragraf.</p>
<p> Acesta este al doilea paragraf. Acesta este al doilea paragraf. Acesta
este al doilea paragraf.</p>
De asemenea, se poate controla i modul n care este aliniat textul n cadrul
unui paragraf, folosind atributul align. Acest atribut accept trei valori: left, center i
right. Spre exemplificare, pentru a alinia un text la marginea din dreapta a
documentului se folosete sintaxa:

1.2. Etichete HTML

15

<p align="left"> Acesta este un paragraf aliniat la marginea din stnga a


documentului. Acesta este un paragraf aliniat la marginea din stnga a
documentului. Acesta este un paragraf aliniat la marginea din stnga a
documentului. Acesta este un paragraf aliniat la marginea din stnga a
documentului. </p>
Tot pentru o structurare a coninutului unui document Web se poate folosi i
eticheta <br> (break row), asigurnd trecerea pe o linie nou a informaiei
precedate de aceasta etichet (fr ns a spaia i alinia corespunztor coninutul
textual, ca n cazul paragrafelor).
- Bold i italic
Caracterele de tipul bold sau italic se pot obine cu ajutorul etichetelor <b>,
respectiv <i>:
<b> Acesta este bold</b>
<i>Acesta este italic</i>
- Setare culoare, mrime i tip caractere
La fel ca n orice procesor de texte i n HTML se poate specifica culoarea,
mrimea i tipul caracterelor ce formeaz textul. n acest sens se folosesc trei
etichete specializate, dup cum urmeaz:
<font color="#FF0000"> Acest text este rosu</font>

<font size="6">Acest text este mai mare!</font>


<font face="Courier">Acest text este scris cu caractere de tip
courier</font>
Valorile valide pentru culorile fontului sunt identice cu valorile hexa care au
fost prezentate n seciunea referitoare la fundaluri. Mrimea scrisului se specific
folosind valori cuprinse ntre 1 i 7, unde 7 reprezint cel mai mare font. Tipul
caracterelor se specific folosind chiar numele acestuia (Courier, Arial, etc.).
Se pot foarte uor include ntr-o singur comand mai multe etichete
pentru a obine un efect dorit. De exemplu, dac se dorete un text scris cu bold,
font de mrimea 2, italic i de tip Arial, atunci se poate scrie:

<b><i><font size="5" face="Arial"> Text</front></i></b>


Dup cum se vede, HTML este foarte flexibil i permite combinarea mai
multor etichete pentru a obine un anumit efect/formatare, n cazul n care acel
efect nu se poate obine cu ajutorul uneia singure.
- Centrarea textului
Eticheta <center> permite centrarea rapid a unui text ntr-o pagin. Un
exemplu n acest sens:
<center><b>Acest text este centrat</b></center>
<center><h3>Acest header este centrat de asemenea!</h3></center>
- Crearea de bare orizontale
Textul poate fi foarte bine structurat n cadrul unui document i cu ajutorul
unor bare orizontale (linie cu o anumit grosime i lungime) care s delimiteze mai
bine diferitele seciuni ale acestuia. Aceste bare se obin cu ajutorul etichetei <hr>.

16

HTML - 1
<hr width=100% size=2>

Pentru a schimba dimensiunile acesteia se pot folosi atributele width


(lungimea) i respectiv size.
Observaie: n noua accepiune de design a site-urilor Web, utilizarea acestor
etichete destinate unei formatrii a informaiei este de multe ori substituit de
tehnica CSS (Cascading Style Sheets), mult mai unitar i eficient. Totui, pentru
formatri punctuale/individuale etichetele anterior referite i pstreaz utilitatea.

1.2.4. Inserarea unei imagini


Inserarea imaginilor ntr-o pagin Web constituie urmtorul pas pentru o
descriere informaional text-imagine. Imaginile pot fi inserate ntr-un document
prin utilizarea etichetei <img>. Codul urmtor insereaz o imagine numit
"poza.gif":
<IMG SRC="poza.gif">
De remarcat c etichetele <img> nu trebuie nchise cu ajutorul
specificatorului / (nu exist un tag perche de inchidere </img). Este unul dintre
cazurile n care nchiderea unei etichete n HTML nu este necesar. Eticheta <img>
dispune de un atribut src, necesar pentru a preciza imaginea care trebuie inserat
(sursa, n acest caz poza.gif), respectiv dispune opional de dou atribute pentru
setarea dimensiunilor afiabile ale imaginii: width i height.
Un artificiu care face ca imaginile s fie ncrcate mai repede este acela de a
specifica explicit dimensiunile acestora, folosind atributele width i respectiv height.
n acest mod,
browser-ele nu mai trebuie s determine informaii despre
dimensiunile acestora i astfel s creasc durata de ncrcare (download). Pentru a
specifica browser-ului acest lucru, se folosete o sintax de genul:
<img src="poza.gif" width="98" height="100">
Atributele width/height pot face mult mai mult dect a mri viteza de
download a imaginilor referite. Astfel, aceste atribute se pot folosi la dimensionarea
dorit pe ecran a imaginilor ncrcate. Spre exemplu, pentru a mri imaginea afiat
cu eticheta anterioar, se poate scrie:
<img src="poza.gif" width="200" height="208">
Observaie: ncrcarea unei/unor imagini de mari dimensiuni poate constitui uneori
sursa unei viteze de reacie sczute din partea paginii Web (fiind vorba de un
transfer al unui volum mai mare de informaie). Din acest motiv, dimensiunea
acestora trebuie s fie rezonabil, recomandndu-se utilizarea fiierelor imagine n
format comprimat (jpg, png, tif).

1.2.5. Hiperlegturi
Tot la categoria caracteristici fundamentale ale HTML se ncadreaz i
posibilitate de a crea hyperlink-uri, asigurnd conexiunile/legturile spre alte pagini
Web i implicit navigarea pe internet. Ce ar fi WWW fr aceste legturi (sau linkuri, hyperlink-uri)? Legturile reprezint esena WWW, evoluia i expansiunea lui

1.2. Etichete HTML

17

fiind asigurat tocmai prin legarea mpreun a milioane i milioane de pagini Web (i
nu numai) de pe tot globul.
O asemenea legtur (hyperlink) este creat cu ajutorul etichetei ancor
<A>. Aceasta necesit un atribut href, care specific URL-ul (Uniform Resource
Locator) int care trebuie urmat dup ce se face click pe respectiva legtur.
Exemplul urmtor prezint o legtur de tip text care va conduce (naviga)
spre site-ul Yahoo:
<a href="http://www.yahoo.com">Click here for Yahoo</a>
Legtura de mai sus este spre un document extern de pe WWW. Se pot de
asemenea crea foarte uor legturi i spre documente locale, aflate chiar pe site-ul
propriu. Trebuie doar furnizat calea complet i corect a acestora relativ la
punctul de unde se apeleaz respectiva legtur. Cteva exemple n acest sens:
<a href="section3.htm"> Click here for the next section</a>
<a href="subdir/section3.htm">Click here for the next section</a>
Prima legtur presupune c documentul section3.htm se afl n acelai
director ca i pagina curent, iar al doilea presupune c section3.htm este n
directorul "subdir", care este subdirector al directorului curent.
Se pot crea legturi folosind i imagini. Dup ce s-a neles modul de creare
a legturilor text, crearea acestora folosind imagini este mai mult dect banal.
Trebuie doar substituit textul cu eticheta <img>. Spre exemplu, click pe o imagine
pentru a asigura legtura (hiperlink-ul) cu site-ul Yahoo:
<a href="http://www.yahoo.com"><img src="paperboy.gif"></a>
Dac se dorete ca imaginea respectiv s fie ncadrat de o bordur:
<a href="http://www.yahoo.com"><img src="paperboy.gif" border=1></a>

1.2.6. Formulare. Metodele GET i POST


Cele mai multe aplicaii Web utilizeaz script-urile de regul pentru
prelucrarea informaiei introdus prin intermediul unor fiiere HTML gen formular.
Rolul script-ului (de regul un CGI) este de a prelua aceste informaii, a le prelucra
i de a returna un rspuns (o pagin HTML afiabil de ctre un browser client) cu
informaia procesat ca rezultat. Altfel spus, rolul unui script const n returnarea
(pe baza unei procesri de informaie realizat pe un server Web) a unor date la
ieirea standard (browser). Aceste date sunt precedate (dac este cazul) de o serie
de antete care vor permite o interpretare corect a ieirii scriptului. Astfel de scripturi permit interaciunea n ambele sensuri ntre client i server.
Antetul pe care scriptul l trimite spre serverul Web trebuie s respecte
specificaiile MIME (Multipurpose Internet Mail Extension). Spre exemplu, un astfel
de antet poate s conin o specificaie de forma: Content-type: text/html
(pentru documente HTML), Content-type: image/jpeg (pentru imagini JPEG) etc.,
care va precede informaia direcionat spre ieirea standard, preciznd tipul de
date care constituie flux de ieire.
Cele mai multe apeluri ale unui script CGI se fac prin intermediul unui
document HTML gen formular, la apsarea unui buton (de regul- SUBMIT).
Se consider urmtorul formular exemplu (fig.1.1):
<form METHOD="GET" ACTION="exemplu.php">
Ani de munca: <input NAME="ani" size=2 ><p>

18

HTML - 1
Salar anual: <input NAME="salar" size=8><p>
<input TYPE="SUBMIT" VALUE="Run Query">
<input TYPE="RESET" VALUE="Sterge">
</form>
Se observ c n cadrul acestui
formular (FORM) se folosete metoda GET
pentru transmiterea parametrilor spre
scriptul indicat prin proprietatea ACTION
(n cazul de fa, un script PHP). Prin
apsarea butonului de tip SUBMIT Run
Query, presupunnd c iniial s-a tastat
5, respectiv 1000, spre scriptul apelat
este transmis un ir (string) de forma:
ani=5&salar=1000.

Fig. 1.1. Formular pentru transmiterea


parametrilor spre script

Acest ir de parametrii poate fi remarcat i n linia de apelare a scriptului,


de altfel parametrii putnd fi transmii i direct spre script, printr-un apel (cu
precizarea complet a cii spre scriptul PHP) cu parametri de forma:
http://localhost/scripts/exemplu.php?ani=5&salar=1000
De remarcat c, variabilele sunt delimitate prin caracterul &, iar caracterele
speciale (\ sau ) sunt nlocuite de codul lor numeric (hexa), precedat de caracterul
procent %. Spaiile se substituie prin semnul +. Atributul SIZE al unei etichete
caset INPUT seteaz dimensiunea vizibil a acesteia pe ecran.
Utiliznd metoda GET, acest string este disponibil ntr-o variabil de mediu
QUERY_STRING. Funcie de mediul folosit pentru crearea scriptului CGI, aceste date
utilizabile ca parametrii de intrare pot fi preluate, dac este cazul, din cadrul acestei
variabile de mediu..
Acelai formular putea folosi ca metod i metoda POST. n cazul metodei
POST datele sunt disponibile, putnd fi accesate de la intrarea standard (i nu prin
intermediul unui string coninut n variabila de mediu QUERY_STRING, lungimea
acestora (n octei) fiind disponibil n variabila de mediu CONTENT_LENGTH.
Evident acest ir (vzut ca parametru de intrare cu GET) nici nu apare n linia de
apelare a scriptului, aa cum se ntmpl la metoda GET. Se recomand utilizarea
metodei POST n situaia transmiterii unui volum mare de date (gen <TEXTAREA>
sau a unui fiier printr-o aciune de upload).
Un exemplu de utilizare a etichetei TEXTAREA:
<textarea rows="3" cols="30" name='nume'>
Ceva text pe primul rand.
Alt rand
</textarea>
Eticheta INPUT este cel mai des utilizat cu atributul type=text, valoare
de altfel implicit. Deci se putea scrie echivalent:

1.2. Etichete HTML

19

<input NAME="ani" type=text size=2 maxlength=2 value=20>


folosindu-se n acest exemplu i alte dou atribute deseori utile:
- maxlength pentru a se limita numrul de caractere care pot fi introduse
de la tastatur (size limiteaz doar numrul de caractere afiabile, putndu-se
introduce oricte, dar zona afiabil a casetei permite doar dou caractere vizibile
ultimele dou).
- value pentru a seta o valoare iniial implicit (20 n cazul de fa).
De asemenea, tipurile SUBMIT, respectiv RESET sunt strict legate de
formularul FORM, transformnd fiecare caseta aferent ntr-un buton i activnd
transferul datelor prim metoda setat, respectiv resetnd (tergnd) coninutul
casetelor din formular.
Atributul TYPE permite o list de valori specifice, enumerndu-se aici doar
cteva dintre cele mai uzuale:
- button folosit n special pentru activarea unui script/secvene JavaScript
la apariia unui eveniment (apsare buton n exemplul urmtor):
<input TYPE="button" VALUE="Go" onclick="mesaj_js()">
- checkbox folosit pentru limitarea opiunilor selectate (predefinite i n
numr limitat), permind selecia uneia sau mai multora (selecie multipl).
- radio folosit pentru limitarea opiunilor selectate, permind selecia doar
a uneia sigure.
- password asigur ascunderea coninutului introdus n caset (cazul
parolelor)
- file genereaz o caset, respectiv un buton Browse, necesare operaiei
Upload de fiiere.
- image definete un buton SUBMIT de tip imagine, atributul VALUE fiind
nlocuit cu SRC pentru referirea unei imagini, ca i n exemplul urmtor:
<input TYPE="IMAGE" src ="imagine.jpg">
- hidden ascunde caseta, fiind util la transferul unor valori implicite din
FORM spre o alt pagin, valori setate prin atributul VALUE.
Un exemplu de formular folosind etichete INPUT cu atributul TYPE setat pe
valorile anterior referite are codul urmtor, iar efectul rulrii lui este prezentat n
figura 1.2.
<form METHOD="GET" ACTION="exemplu.php">
<input type="file"><p>
Utilizator: <input NAME="nume" type=text size=10><p>
Parola: <input NAME="parola" type="password"><p>
Informatie ascunsa: <input NAME="ascuns" type="hidden" value="ascuns"><p>
Autoturism <input type="checkbox" name="vehicol" value="Dacia" />
Autoturism Dacia
<input type="checkbox" name="vehicol" value="Ford" /> Autoturism Ford <p>
Sex:<p>
<input type="radio" name="sex" value="M"> Masculin<br
<input type="radio" name="sex" value="F"> Feminin <br>
Descriere: <textarea rows="3" cols="30" name='date'>
Ceva text pe primul rand.
Alt rand
</textarea>
<input TYPE="IMAGE" src="imagine.jpg">
</form>

20

HTML - 1

Fig. 1.2. Formular pentru transmiterea parametrilor spre script

Se poate remarca atribuirea unor nume identice casetelor de tip checkbox,


respectiv radio, n timp ce toate celelalte casete INPUT (inclusiv TEXTAREA) au
nume distincte, acestea fiind practic parametri transmii de formular spre o alt
pagin Web. Dac se folosete metoda GET, string-ul cu parametri are urmtoarea
form:
exemplu.php?nume=Ion&parola=parola&ascuns=ascuns&vehicol=Dacia&vehicol=Fo
rd&sex=M&date=Ceva+text+pe+primul+rand.%0D%0AAlt+rand%0D%0A&x=25&y
=28
Se remarc n cadrul lui regulile menionate deja: delimitare parametri prin
caracterul &, nlocuirea caracterelor speciale cu codul lor hexa precedat de
caracterul procent %, nlocuirea spaiilor cu +.
Observaie: Eticheta FORM dispune de atributul TARGET care permite afiarea
paginii apelate (spre care se trimit parametri) ntr-un alt frame (vezi paragraful
destinat frame-urilor). Spre exemplu (pentru un frame cu numele frame1):
<form METHOD="GET" ACTION="exemplu.php" target="frame1">
O alt etichet HTML care permite o selecie multipl (nefcnd parte din
categoria etichetelor de tip INPUT) este eticheta SELECT (practic echivalentul unui
element de tip combobox specific altor limbaje de programare vizual).
Iat un exemplu de cod relevant privind utilizarea acestei etichete SELECT
(cu sub-etichetele OPTION), efectul rulrii lui fiind prezentat n fig. 1.3:
<form METHOD="GET" ACTION="apelat.php">

1.2. Etichete HTML

21

Persoane cu virsta:
<SELECT NAME="virsta" size="1">
<OPTION VALUE="0"> mai mare ca 0
<OPTION VALUE="10" > mai mare ca 10
<OPTION VALUE="20"> mai mare ca 20
<OPTION VALUE="30"> mai mare ca 30
</SELECT>
<SELECT MULTIPLE NAME="meserie[]">
<OPTION selected VALUE="Inginer"> Inginer
<OPTION VALUE="Sofer" > Sofer
<OPTION VALUE="Dentist"> Dentist
</SELECT>
Autoturism <input type="checkbox" name="vehicol[]" value="Dacia" />
Autoturism Dacia
<input type="checkbox" name="vehicol[]" value="Ford" /> Autoturism Ford
<p>
<input TYPE="SUBMIT" VALUE="Cauta">
</form>

Fig.1.3. Selecii multiple

Primul tag <SELECT> numit virsta, prin modul lui de definire permite
selectarea (la un moment dat) doar a unei singure opiuni, fiind practic o caset cu
derulare: <SELECT NAME="virsta" size="1">
Dac parametrul size are valoarea 1, este vizibil o singur opiune la
momentul iniial; dac are o valoare n, la momentul iniial vor fi vizibile n opiuni
(indiferent ns de valoarea lui n, o singur opiune poate fi selectat).
Al doilea tag <SELECT> numit meserie, permite realizarea unor selecii
multiple (vezi i figura 1.3):
Cazul unor etichete care permit o selecie multipl ridic anumite probleme
privind preluarea valorilor parametrilor transmii de ctre acestea. Problema se
datoreaz faptului c, un acelai parametru este pasat simultan cu mai multe valori
diferite (selecii multiple), fiind ntlnit att la etichetele SELECT, ct i la INPUT de

22

HTML - 1

tip checkbox (acesta este motivul pentru care s-a inserat n exemplul anterior i o
secven de cod specific unei etichete INPUT checkbox). Problema prelurii acestor
parametri cu valori multiple, n ambele situaii, se rezolv stabilind un nume al
etichetei ntr-o sintax specific unui array (ir): meserie[],vehicol[]. Apoi
scriptului apelat, spre care sunt pasai parametri, i revine sarcina de a prelua aceste
variabile de tip ir (array) i de extrage, succesiv, valorile elementelor lor. n
capitolul urmtor se va reveni asupra problemei, prezentndu-se modul n care un
script PHP trateaz aceast situaie specific unor selecii multiple.

1.3. Frame-uri
1.3.1. Frame-uri linie/coloan
Frame-urile (numite i cadre) sunt practic elemente HTML prin care se
realizeaz o mprire a ecranului n mai multe zone (regiuni) de afiare,
permindu-se astfel afiarea simultan ntr-un acelai ecran a mai multor pagini
Web.[1][2]
O astfel de mprire a ecranului n mai multe regiuni, permite o
prezentare a informaiei ntr-o form mai flexibil, mai practic i uneori mai util.
n fiecare frame (avnd un anumit nume) este afiat coninutul unui anumit fiier
HTML (script), referit printr-un URL. Frame-ul poate fi redimensionat (opional) de
ctre utilizator. Cele mai uzuale marcaje (cuvinte cheie, tag-uri) specifice proiectrii
unei pagini Web utiliznd frame-uri sunt:
<FRAMESET>, <FRAME> (absolut obligatorii), respectiv (ca atribute opionale):
<NOFRAMES>,
TARGET,
ROWS,
COLS,
FRAMEBORDER,
BORDERCOLOR,
FRAMESPACING, NORESIZE, MARGINWIDTH, MARGINHEIGHT, SCROLLING,
<IFRAME>.
Utilizarea unor frame-urile n cadrul unei pagini Web presupune, ntr-o prim
faz, o definire a acestora n cadrul documentului HTML. Definirea frame-urilor
precizeaz tipul acestora, numrul i poziia lor n cadrul paginii Web, precum i
URL-urile (adresele) ctre fiierele HTML care vor constitui coninutul lor (coninutul
propriu-zis fiind practic stocat ntotdeauna separat, ntr-un alt fiier HTML).
Definiia unei succesiuni de frame-uri care vor fi plasate pe un ecran este
marcat printr-o etichet de tip <FRAMESET> (pentru o setare global). Eticheta
<FRAMESET> va fi ignorat dac orice alte etichete sunt plasate nainte, ntre taguri de tip <BODY>. Eticheta container <FRAMESET> conine o serie de etichete
<FRAME> , fiecare descriind succesiv cte un frame din setul de frame-uri care vor
alctui ecranul.
Dimensiunea i plasarea n pagin a unui frame sunt precizate n termeni de
rnduri i coloane, utiliznd combinaii de etichete <FRAMESET> i <FRAME>.
Exemplul urmtor prezint modul n care poate fi realizat o succesiune de 3
cadre, plasate n linie sub forma a trei coloane separate, n fiecare dintre ele
ncrcndu-se un fiier HTML, referit explicit printr-un URL (fiierele One.html,
Two.html, Three.html). Prima coloan este setat la 80 pixeli lime, coloana a doua
este setat la 25% din aria (limea) disponibil iar a treia coloan trebuie s ocupe
restul spaiului rmas (fig.1.4). nlimea ecranului este utilizat integral de ctre

1.3. Frame-uri

23

fiecare coloan. Fiecare coloan din exemplul prezentat este practic un frame
coloan, precizarea acestui tip (coloan) fiind dictat de folosirea atributului COLS:
<FRAMESET COLS="80,25%,*">
<FRAME SRC="one.htm">
<FRAME SRC="two.htm">
<FRAME SRC="three.htm">
</FRAMESET>
Pentru aranjarea pe linii a unor frame-uri, se utilizeaz atributul ROWS n
locul atributului COLS.

Fig.1.4. Frame-uri coloan

Deci, definirea modului de plasare pe ecran a frame-urilor, precum i a


dimensiunilor lor, se face prin atributele ROWS sau COLS, care stabilesc nlimea
unei linii (cadru linie) sau limea unei coloane (cadru coloan), printr-o list de
valori (de genul celei exemplificate). Aceste valori sunt descrise ca valori absolute n
pixeli, valori procentuale de la 1% la 100% sau ca i valori relative utiliznd un
asterisc (*). Browser-ele Mozilla au tendina de a rotunji dimensiunile unui frame,
lucrnd doar cu multipli de 10 pixeli. nlimea total a tuturor cadrelor linie trebuie
s fie egal cu nlimea total a ferestrei, deci valorile pot fi normalizate de ctre
browser dac e necesar.
Spre exemplificare:
<FRAMESET ROWS="2*,*">
face cadrul linie de sus de dou ori mai nalt dect cadrul de jos;
<FRAMESET COLS="50,*,50">
fixeaz nlimea cadrelor din stnga i dreapta i aloc spaiul rmas n
fereastra cadrului din mijloc;
<FRAMESET ROWS="20%,60%,20%">
afieaz un cadru de mijloc mai mare, ntre dou cadre mici.
Observaie: Dei la ora actual se recomand evitarea folosirii frame-urilor (datorit
modului deficitar n care este perceput o pagin dintr-un frame de ctre un motor
de cutare), acestea ofer nc o alternativ simpl i eficient de structurare a
informaiei din mai multor pagini Web pe un singur ecran (fiind nc des ntlnite
mai ales n cadrul aplicaii Web intranet, neindexabile de ctre motoarele de
cutare).

1.3.2. Frame-uri ncuibate


Exemplul anterior descrie trei frame-uri plasate ntr-o aceeai definiie
FRAMESET. Pentru a crea un aranjament mai complex al paginii Web se poate plasa

24

HTML - 1

o definiie FRAMESET i frame-urile asociate ei ntr-o alt definiie FRAMESET.


Aceast metod este cunoscut sub denumirea de ncuibare de frame-uri. n
exemplul urmtor se arat o modalitate de grupare (ncuibare) a unor frame-uri,
punnd o definiie FRAMESET n alta. Pentru nceput se definete un FRAMESET de
baz, coninnd dou frame-uri linie (fig. 1.5):
<FRAMESET ROWS="*,50%">
<FRAME SRC="five.htm">
<FRAME SRC="four.htm">
</FRAMESET

Fig.1.5. Frame-uri linie

Se nlocuiete definiia FRAME-ul care afieaz coninutul fiierului five.htm


cu definiia FRAMESET i frame-urile din exemplul descris n paragraful anterior,
rezultnd:
<FRAMESET ROWS="*,50%">
<FRAMESET COLS="80,25%,*">
<FRAME SRC="one.htm">
<FRAME SRC="two.htm">
<FRAME SRC="three.htm">
</FRAMESET>
<FRAME SRC="four.htm">
</FRAMESET>
Efectul este prezentat n figura 1.6, rezultatul fiind crearea a 4 frame-uri.
Nu exist o limitare a numrului de frame-uri care se pot grupa (ncuiba),
dei, n practic, utilizarea a mai mult de trei frame-uri pe ecran face ca lucrurile s
devin complicate pentru utilizator.
Pot nc apare situaii de clieni Web care utilizeaz pentru navigare un
browser non-frame (care nu suport frame-uri). Problema este destul de
important, deoarece trebuie s se asigure citirea coninutului paginii i n cazul
utilizrii unui astfel de browser. Elementul <NOFRAMES> permite asigurarea acestei
cerine. n interiorul etichetelor pereche <NOFRAMES> </NOFRAMES> se poate
pune orice informaie care s-ar pune normal ntre etichetele <HTML> </HTML >.

1.3. Frame-uri

25

Fig. 1.6. Frame-uri ncuibate

Dac nu se ofer o astfel de alternativ de utilizare prin plasarea unei


informaii ntre etichetele <NOFRAMES> </NOFRAMES>, un "cititor" al paginii care
utilizeaz un browser care nu suport frame-uri, nu va vedea nimic i va fi forat s
abandoneze navigarea pe acel site. Browser-ele care suport frame-uri ignor
coninutul plasat ntre etichetele <NOFRAMES>. Exemplu:
<FRAMESET ROWS="*,50%">
<FRAME SRC="five.htm">
<FRAME SRC="four.htm">
<NOFRAMES>
<BODY>
<P>Welcome to my page.
<A HREF="noframes.htm">Continue</A> to the frame-free version.</P>
</BODY>
</NOFRAMES> </FRAMESET>

1.3.3. Atribute ale frame-urilor


Asupra frame-urilor se poate exercita un control setnd corespunztor
anumite proprieti ale acestora. Astfel, se poate pune sau nu o bordur frameurilor, se pot colora, se pot ndeprta barele de rulare (scrooll) sau se poate realiza
o redimensionare a lor.
Atribute ale etichetei <FRAMESET>:
Urmtoarele atribute (proprieti) pot fi aplicate unui element <FRAMESET>,
pentru un control suplimentar, avnd un efect de setare global asupra tuturor
definiiilor FRAME incluse n FRAMESET:
FRAMEBORDER="yes|no"|0 - permite sau nu punerea unei margini
(borduri) n jurul frame-urilor aferente unei definiii FRAMESET. n mod curent,
ncepnd cu Netscape Navigator 3 (i continund cu Mozilla) se folosesc valorile yes
i no, n timp ce Microsoft Internet Explorer folosete valoarea 0 pentru a scoate
bordura (care altfel este implicit). Pentru ca marginile s nu fie trasate, toate
frame-urile care i mpart o margine comun, trebuie s aib atributul
FRAMEBORDER setat pe "no". Acest atribut poate fi folosit i cu eticheta <FRAME>
pentru setarea marginilor pentru un singur frame, bine precizat.

26

HTML - 1

BORDER=pixels - utilizat doar ncepnd cu Netscape Navigator 3 (sau o


versiune mai evoluat Mozilla), acest atribut permite setarea limii marginilor
(bordurilor) n pixeli, ntr-o definiie FRAMESET.
BORDERCOLOR="#hexcolor|colorname" - se poate utiliza acest atribut
(doar cu Mozilla), permind setarea culorii bordurii frame-urilor cuprinse ntr-o
definiie FRAMESET, prin specificarea unui triplet hexa RGB convenional sau direct a
numelui culorii. Atributul poate fi utilizat i cu eticheta <FRAME> pentru setarea
culorii marginii unui singur frame.
Atribute ale etichetei FRAME:
Urmtoarele atribute pot fi aplicate la elementele <FRAME> pentru un
control suplimentar la nivelul unui singur frame, bine precizat:
SCROLLING="yes|no|auto" - permite introducerea sau nu, a unei bare
de derulare (scroll) a coninutului frame-ului. n lips, valoarea implicit este "auto",
lsnd browser-ul s decid dac frame-ul are nevoie de bare de derulare
(informaia afiat n frame nu este vizibil, nu ncape n totalitate n zona de afiare
aferent frame-ului) sau nu.
NORESIZE - mpiedic redimensionarea frame-ului. n lipsa lui, implicit,
utilizatorul poate redimensiona frame-urile, trgnd marginile acestora ntr-o nou
poziie.
MARGINWIDTH=pixels - seteaz dimensiunea marginilor din dreapta i
stnga frame-ului, n pixeli (distana dintre text i margine). n lipsa atributului,
implicit, browserul va decide singur dimensiunea marginilor.
MARGINHEIGHT="pixels" - seteaz marginea de sus i de jos a frameului, n pixeli. n lipsa atributului, browser-ul va decide singur dimensiunea acestor
margini.
BORDERCOLOR="color" - ncepnd cu Netscape Navigator 3 (actualmente
Mozilla) este permis setarea culorii marginii frame-ului, prin specificarea unui
triplet hexa RGB convenional. Acest atribut poate fi utilizat i cu eticheta
<FRAMESET>, pentru seterea culorii marginii pentru un grup de frame-uri.
FRAMESPACING="pixels" - ncepnd cu Microsoft Internet Explorer 3,
atributul permite setarea spaiului liber din jurul frame-ului, definit n pixeli.
FRAMEBORDER="yes|no"|0 - permite plasarea sau nu a unei margini din
jurul frame-ului. n mod curent, ncepnd cu Netscape Navigator 3 se folosesc
valorile yes i no, n timp ce ncepnd cu versiunea Microsoft Internet Explorer 3 se
folosete valoarea 0 (implicit, lipsa atributului, semnific faptul c frame-ul are
bordur). Acest atribut poate fi folosit i cu eticheta <FRAMESET> pentru setarea
marginilor unui grup de frame-uri. Marginile unui frame vor fi eliminate numai dac
ambele frame-uri adiacente (chiar definite n FRAMESET-uri distincte) au atributele
FRAMEBORDER setate n conformitate.

1.3.4. Frame-uri legate


Unul din principalele avantaje ale utilizrii frame-urilor, const n faptul c se
poate utiliza o legtur (link) dintr-un frame, pentru a deschide (afia) o anumit
pagin ntr-un alt frame, pe aceeai pagin ecran. Apelnd o anumit referin (sau
apsnd un buton) ntr-unul din frame-uri (surs), se poate deschide astfel o nou
pagin ntr-un alt frame (int, target) al aceluiai ecran, restul coninutului
ecranului rmnnd neschimbat.

1.3. Frame-uri

27

Primul pas pentru a stabili un rol de target pentru un frame const n


ataarea unui nume acelui frame. Aceast operaie este realizat n eticheta de
definire a frame-ului respectiv (<FRAME>), utiliznd atributul NAME. Exemplu:
<FRAME SRC="pagina32.htm" NAME="zona_tinta">
Direcionarea unei informaii dintr-un fiier HTML spre un anumit frame
target, se face utiliznd atributul TARGET. Acest atribut nu se gsete n definirea
frame-ului, fiind utilizat ca atribut pentru diverse etichete HTML (ancore, butoane) n
scopul direcionrii datelor/informaiei spre un anumit frame int.
Pentru exemplificare se consider urmtorul exemplu, cu dou frame-uri, al
doilea frame constituind zon int pentru o referin de tip ancor afiat n
primul:
<FRAMESET ROWS="*,50%">
<FRAME SRC="continut_initial1.htm" >
<FRAME SRC="continut_initial2.htm" name="zona_tinta">
</FRAMESET>
Fiierul continut_initial1.htm trebuie s conin o referin ancor,
avnd specificat un atribut TARGET spre frame-ul al doilea:
<A TARGET="zona_tinta" HREF="continut_final.htm">Pagina noua in frameul 2</A>
n momentul cnd din primul frame este apelat aceast referin, coninutul
fiierului continut_final.htm este afiat n cel de-al doilea frame (frame-ul
target). Dac numele intei specificate cu atributul TAGET nu exist, documentul
legat va fi deschis ntr-o nou fereastr, avnd numele similar cu cel precizat n
atributul TARGET. Exist cteva nume int speciale, predefinite. Toate acestea
ncep cu liniu de subliniere ( _ ) i sunt folosite pentru ncrcarea unor pagini n
anumite frame-uri. Aceste target-uri speciale sunt:
TARGET="_self" - documentul se ncarc n acelai frame care conine i
legtura (frame-ul se ncarc pe el nsui, opiune implicit).
TARGET="_parent" - documentul se ncarc n aceeai pagin frameset ca
i legtura, n felul acesta ndeprtnd orice alte "sub-frame-uri". Practic se ncarc
pagina printe n care este realizat definiia FRAMESET.
TARGET="_top" - documentul se ncarc n tot corpul ferestrei, aceasta
eliberndu-se de toate frame-urile. Aceast metod este util atunci cnd o legtur
direcioneaz utilizatorul spre un alt site.
TARGET="_blank" - documentul se ncarc ntr-o fereastr nou.
Atributul TARGET este deseori folosit n cadrul unui FORM inclus ntr-un
frame, asigurnd afiarea pagini apelate (spre care se transmit parametri) ntr-un
alt frame. Exemplu:
<form METHOD="GET" ACTION="apel.php" TARGET=numeframe>
Parametri formularului sunt pasai spre pagina apelat (apel.php), aceasta
procesnd informaia transmis i o afieaz n frame-ul numeframe (altul dect
frame-ul n care este afiat formularul)
Observaie: ncepnd cu versiunea 3.01 Microsoft Internet Explorer suport i aa
numitele floating frames, prin utilizarea etichetei <IFRAME>, plasarea unui frame
putndu-se face n orice poziie a unei pagini Web. Spre exemplu, urmtoarea
secven plaseaz un frame lng un text format:
<h1>Text de afisat</h1>
<IFRAME SCROLLING=YES FRAMEBORDER=1 ALIGN=top
HEIGHT=300 WIDTH=300 SRC="initial.html"> </IFRAME>

28

HTML - 1

1.4. Tabele
1.4.1. Elemente introductive
O tabel permite organizarea datelor pe linii (rnduri) i coloane, ca
modalitate de prezentare a unei informaii (text sau grafic) ntr-o pagin. Tabelele
sunt extrem de utilizate ca mod de formatare a informaiei returnate prin
interogarea unei baze de date.[1][4]
Cele mai uzuale marcaje (cuvinte cheie, tag-uri, etichete) specifice
proiectrii
unei
pagini
Web
utiliznd
tabele
(afiri
tabelate)
sunt:
<TABLE>,<TR>,<TD>,<TH> (lista putnd continua cu <CAPTION>, <COL>,
<COLGROUP>, <SPAN>, etc)
Definiia oricrui tabel presupune utilizarea perechii de etichete <TABLE>
</TABLE>. n definiia tabelei se poate folosi (opional) o etichet <CAPTION>, prin
care se ataeaz un titlu tabelului.
Dup cum se va prezenta n continuare, tabelele sunt construite succesiv,
linie cu linie (o linie la un moment dat, apoi alt linie, s.a.m.d.). Liniile unei tabele
sunt definite prin perechi de etichetele <TR> </TR>. n interiorul acestor etichete
trebuie inclus cel puin un header (cap de tabel) sau element de tip date (articol,
informaie) utiliznd perechea de etichete <TH> </TH>, respectiv <TD> </TD>
(etichete controlnd definirea unei coloane sau mai precis un element coloan al
unei linii). De subliniat faptul c, construcia unei tabele ncepe tot timpul cu
definiia unei linii (<TR>), iar n cadrul definiiilor liniilor sunt generate celulele
aferente coloanelor (<TH> pentru celule cap tabel, <TD> pentru celulele date)
Exemplu:
<TABLE border=1>
<CAPTION ALIGN=top>Clasament</CAPTION>
<TR>
<TH>Cool</TH>
<TH>Sad</TH>
</TR>
<TR>
<TD>Belle & Sebastian</TD>
<TD>Michael Bolton</TD>
</TR>
<TR>
<TD>Bentley Rhythm Ace</TD>
<TD>Mariah Carey</TD>
</TR>
</TABLE>
Efectul pe ecran este urmtorul:
Clasament
Cool
Belle & Sebastian
Bentley Rhythm Ace

Sad
Michael Bolton
Mariah Carey

1.4. Tabele 29
Analiznd codul, se poate remarca modul n care s-a construit succesiv
fiecare linie (capul de tabel, urmat de dou linii cu informaie), iar n cadrul fiecrei
linii modul n care s-au realizat celulele (practic mprirea liniei pe coloane).

1.4.2. Controlul global al unui tabel


Exist numeroase metode pentru a controla designul unui tabel. n primul
rnd, se poate aduga o bordur (margine) fiecrei celule a tabelului; aceast
operaie crend practic un caroiaj pentru tabel. Se poate specifica poziia titlului
tabelului (sus sau jos) i limea tabelului. Se poate, de asemenea, spaia coninutul
tabelului, aduga spaii ntre celulele tabelului sau crea margini (contururi) n jurul
coninutului fiecrei celule. Toate aceste efecte pot fi realizate prin adugarea unuia
sau mai multora dintre atributele urmtoare, specifice etichetei de control global al
designului unui tabel <TABLE>.
BORDER=value - includerea acestui atribut permite realizarea unei borduri
n jurul tuturor celulelor tabelului. Limea bordurii se precizeaz n pixeli. Dac
atributul nu este utilizat, nu apare nici o bordur, totui un spaiu liber va rmne n
jurul fiecrei celule ca i cum o bordur ar fi prezent.
ALIGN=left/right - folosit pentru a afia tabelul n stnga, dreapta sau
centrat n fereastr. (pentru Nestcape, valabil ncepnd cu versiunea 4, i
continund cu Mozilla).
CELLSPACING=value - permite specificarea dimensiunilor (n pixeli) a
spaiilor inserate ntre celulele individuale ale tabelului.
CELLPADDING=value - permite specificarea dimensiunii (n pixeli) a
spaiului inserat ntre marginea i coninutul unei celule din tabel.
WIDTH=value/percent - permite precizarea limii tabelului (n pixeli sau n
% referitoare la limea documentului (paginii)).
Observaie: Cel mai compactat tip de tabel trebuie s foloseasc atributele BORDER,
CELLSPACING i CELLSPADDING setate pe zero.
Spre exemplificare, definiia TABLE din exemplul precedent poate fi
completat cu aceste atribute, astfel:
<TABLE BORDER=5 WITH=75% CELLPADDING=6 CELLSPACING=2
ALIGN=LEFT>

1.4.3. Controlul unei celule


Pe lng un control global, asupra tuturor elementelor (celulelor) unui tabel,
se pot modifica i individual atributele fiecrei celule.
Modificrile care pot fi fcute afecteaz alinierea (pe orizontal sau
vertical), limea i nlimea celulelor, aranjarea textului ca informaie. De
asemenea se pot aduga culori sau grafice (vezi paragrafele urmtoare).
Urmtoarele atribute pot fi aplicate unei ntregi linii, prin includerea lor ntre
etichetele de tip <TR>, sau unei celule individuale prin includerea ntre etichetele
<TD></TD>.
ALIGN=left/center/right - permite alinierea ntregului text al unei linii sau
celule.

30

HTML - 1

VALIGN=top/middle/botton/baseline vertical align - utilizat pentru alinierea


ntregului text al unei linii sau celule (sus, la mijloc, jos) i de asemenea pentru a
specifica faptul c toate celulele ncep (sunt aliniate) de la aceeai linie de baz.
Urmtoarele atribute pot fi, de asemenea, aplicate oricrei celule prin
includerea lor ntre etichete de tip <TD> sau <TH>.
WIDTH=value/percent - permite setarea limii celulei (n pixeli sau % din
limea tabelului). Fixarea unei limi particulare pentru o celul, conduce la fixarea
acelei limi pentru tot tabelul.
HEIGHT=value/percent
- permite setarea nlimii celulei (n pixeli
sau % din limea tabelului). Fixarea unei nlimi particulare pentru o celul,
conduce la fixarea acelei nlimi pentru toat linia.
NOWRAP - specific faptul c liniile dintre celule nu vor fi ntrerupte pentru
a seta limea celulei.
<TABLE BORDER=1>
<TR>
<TH>Cool</TH>
<TH>Sad</TH>
</TR>
<TR VALIGN="BOTTOM" ALIGN="CENTER">
<TD HEIGHT=35>Belle & Sebastian</TD>
<TD NOWRAP>That Michael used to have such lovely hair,don't you think
Gladys?</TD>
</TR>
<TR VALIGN="TOP">
<TD WIDTH=200 ALIGN="RIGHT">Bentley Rhythm Ace</TD>
<TD HEIGHT=35>Mariah Carey</TD>
</TR>
</TABLE>

1.4.4. Combinarea celulelor


Urmtorul pas pentru crearea unui tabel cu un aspect dorit, const n unirea
unor celule, atunci cnd aceasta se impune. Se pot uni celule astfel nct, o celul s
cuprind dou sau mai multe linii sau dou sau mai multe coloane. Acest lucru se
poate face utiliznd atributele COLSPAN i ROWSPAN, astfel:
COLSPAN=value - utilizat pentru a specifica cte coloane sunt cuprinse ntro celul.
ROWSPAN=value - utilizat pentru a specifica cte linii sunt cuprinse ntr-o
celul.
Exemplu (nsoit de vizualizarea tabelului creat):
<TABLE BORDER=1>
<TR>
<TH ROWSPAN=2></TH>
<TH COLSPAN=2>Rating</TH>
</TR>
<TR>
<TH>Sad</TH>
<TH>Cool</TH>
</TR>
<TR>

1.4. Tabele 31
<TH ROWSPAN=2>Artist</TH>
<TD>Belle & Sebastian</TD>
<TD>Michael Bolton</TD>
</TR>
<TR>
<TD>Bentley Rhythm Ace</TD>
<TD>Mariah Carey</TD>
</TR>
</TABLE>
Efectul n pagina Web este urmtorul:
Rating

Artist

Sad
Belle & Sebastian
Bentley Rhythm Ace

Cool
Michael Bolton
Mariah Carey

1.4.5. Formatarea coloanelor


Prin utilizarea etichetelor <COL> sau <COLGROUP> se poate specifica
aranjarea textului n cadrul coloanelor unui tabel. n mod esenial, aceste atribute
permit formatarea unor celule n cadrul unei coloane, n aceeai manier n care
<TR> permite formatarea unor celule n cadrul unei linii. Se utilizeaz atributul
<COLGROUP> pentru a formata dou sau mai multe coloane n acelai timp i
<COL> pentru a formata o coloan individual. Atributul <COL> trebuie ntotdeauna
inclus n cadrul unei perechi de etichete <COLGROUP>.
ALIGN=center/justify/left/right - alinierea textului (pe orizontal)
VALIGN=baseline/bottom/middle/top - aliniere pe vertical .
SPAN=number - seteaz numrul de coloane asupra crora acioneaz
atributele ALIGN i VALIGN.
WIDTH=pixels - seteaz limea coloanei n pixeli.
Exemplu:
<TABLE BORDER=1 WIDTH=80%>
<COLGROUP>
<COL ALIGN="left">
<COL ALIGN="right" VALIGN="bottom">
</COLGROUP>
<COLGROUP SPAN=2 ALIGN="center" VALIGN="top">
</COLGROUP>
<TR>
<TH>Cool</TH>
<TH>Groovy</TH>
<TH>Unique</TH>
<TH>Sad</TH>
</TR>
<TR>
<TD HEIGHT=35>Belle & Sebastian</TD>
<TD>The Wedding Present</TD>
<TD>Tricky</TD>

32

HTML - 1
<TD>Michael Bolton</TD>
</TR>
<TR>
<TD HEIGHT=35>Bentley Rhythm Ace</TD>
<TD>Leftfield</TD>
<TD>Nine Inch Nails</TD>
<TD>Mariah Carey</TD>
</TR>
</TABLE>
Cool

Groovy

Unique

Sad

Belle & Sebastian

The Wedding Present

Tricky

Michael Bolton

Bentley Rhythm Ace

Leftfield

Nine Inch Nails

Mariah Carey

1.4.6. Fundal i margini tabel


Culorile pot fi incluse ntr-un tabel prin utilizarea unor atribute adiionale la
elementele <table>, <tr>, <td>, <th>.
Aceste atribute sunt: bgcolor, bordercolor, bordercolorlight, bordercolordark,
controlnd culorile fundalului sau a bordurilor tabelelor. Pentru ca o colorare a
tabelului s afecteze i bordura, atributele border trebuie s fie prezente n cadrul
unor etichete <TABLE>. Toate culorile trebuie exprimate (n mod convenional) fie
ca triplete hexa RGB, fie prin "nume" ale culorilor.
Dac atributele de culoare sunt plasate ataat unui element <table> ele se
vor referi la ntregul tabel. Dac sunt ataate unor etichete <tr> (sau <th>, <td>),
ele vor aciona la nivel de linie sau celul individual.
bgcolor="#hextriplet"/"colourname" - se specific culoarea de fundal a
celulei (celulelor).
bordercolor="#hextriplet"/"colourname" - specific culoarea bordurii celulei
(celulelor).
bordercolorlight="#hextriplet"/"colourname"
bordurile
pot
fi
reprezentate tridimensional. Pentru a folosi acest efect, se utilizeaz o iluminare sau
ntunecare a bordurii. Se utilizeaz acest atribut pentru a seta culoarea de
iluminare.
bordercolordark="#hextriplet"/"colourname" - se utilizeaz acest atribut
pentru a seta culoarea de ntunecare.
Exemplu:
<TABLE BORDER BGCOLOR="Silver" BORDERCOLOR="Black" WIDTH=50%>
<TR>
<TH>Cool</TH>
<TH>Sad</TH>
</TR>
<TR BORDERCOLOR="Red" BGCOLOR="Green">
<TD>Belle & Sebastian</TD>
<TD>Michael Bolton</TD>

1.4. Tabele 33
</TR>
<TR BORDERCOLOR="Red" BGCOLOR="Green">
<TD BORDERCOLOR="Yellow">Bentley Rhythm Ace</TD>
<TD BGCOLOR="White">Mariah Carey</TD>
</TR>
<TR BORDERCOLOR="Orange" BORDERCOLORDARK="Blue"
BORDERCOLORLIGHT="White">
<TD>The Wedding Present</TD>
<TD>Celene Dion</TD>
</TR>
</TABLE>
Efectul pe ecran al scriptului HTML anterior este urmtorul:
Cool
Sad
Belle & Sebastian
Michael Bolton
Bentley Rhythm Ace
Mariah Carey
The Wedding Present
Celene Dion
Adugarea unei imagini ca background la un tabel (ncepnd cu Microsoft
Internet Explorer 3 i Netscape 4, apoi continund cu familia Mozilla) se poate face
utiliznd atributul background, ataat unor etichete de genul <table> sau <td>
(exact ca i pentru o etichet <body>). Exist cteva deosebiri n aceast problem,
referitor la modul de lucru cu Mozilla i Internet Explorer. Mozilla repet graficul de
background la nceput, pentru corpul fiecrei celule, n timp ce Internet Explorer
acoper cu acea imagine ntreg tabelul, inclusiv bordurile. n plus, Mozilla nu
permite un background individual pentru fiecare celul, dac s-a specificat deja un
background global, pentru ntreg tabelul.
Exemplu:
<TABLE BACKGROUND="graphics/babies.gif" WIDTH=50% BORDER=1>
<TR>
<TH BGCOLOR="orange">Cool</TH>
<TH BGCOLOR="orange">Sad</TH>
</TR>
<TR>
<TD>Belle & Sebastian</TD>
<TD>Michael Bolton</TD>
</TR>
<TR>
<TD>Bentley Rhythm Ace</TD>
<TD>Mariah Carey</TD>
</TR>
<TR>
<TD>The Wedding Present</TD>
<TD BACKGROUND="graphics/flower_t.jpg">Celene Dion</TD>
</TR>
</TABLE>
Observaie: Pentru crearea unei celule vide se poate folosi o secven de genul:
<TD>&nbsp; </TD> (&nbsp; - jucnd rolul unui spaiu).

34

HTML - 1

1.5. Liste
Listele permit ordonarea dup anumite criterii i afiarea informaiei pe
ecran sub forma unor articole (item-uri) bine structurate.[1][2]
Exist mai multe tipuri de liste care pot fi create, cele mai importante fiind
listele ordonate i neordonate.
Iat
cteva
etichete
specifice
crerii
unor
liste:
<LI>,<OL>,<UL>,<MENU>,<DIR>,<DL>,<DT>,<DD>,
O list conine o succesiune de item-uri (articole/elemente). Tipul de list
determin cum sunt descrise (afiate) item-urile. Pentru cazuri mai complexe se pot
crea i liste ncuibate, pe mai multe nivele.

1.5.1. Liste neordonate


O list neordonat prevede fiecare element al listei cu un bullet (marcaj
grafic). O astfel de list este delimitat de o pereche de etichete <UL> </UL>.
Atributul prin care se stabilete tipul de marcaj al fiecrui articol (fig.1.7)
este: TYPE= disc/circle/square
<UL>
<LI>Pulp</LI>
<UL>
<LI>Jarvis Cocker</LI>
<LI>Candida Doyle</LI>
</UL>
<LI>TheWedding Present</LI>
<UL TYPE=square>
<LI>David Gedge </LI>
<LI>Simon Smith </LI>
</UL>
<LI>Spacemen 3</LI>
<UL>
<LI>Sonic Boom</LI>
<LI>Jason Spaceman</LI>
</UL>
</UL>
Fig. 1.7. Lista neordonat

1.5.2. Liste ordonate


O list ordonat asigur o numerotare secvenial automat a articolelor
listei. Delimitatorii unei liste ordonate sunt reprezentai de perechea de etichete
<OL> </OL>. Atributele care stabilesc tipul de numerotare sunt:
START= n - valoarea de start a numerotrii. Valoarea este ntotdeauna
specificat n termeni de 1,2,3, etc., indiferent de orice atribut TYPE.
TYPE =1/A/a/I/i - numerotare conform tabelului urmtor.

1.5. Liste

35

Tabel 1.3.

1
A
a
I
i

1,2,3,
A,B,C,
a,b,c,
I,II,III,
i,ii,iii,

Exemplu:
<OL TYPE=i START=2 >
<LI>Element2.</LI>
<LI>Element3.</LI>
<LI> Element4.</LI>
</OL>
cu rezultatul:
ii. Element2
iii. Element3
iv. Element4

1.5.3. Alte tipuri de liste


- Liste directoare
O list directoare ar trebui s fie mprejmuit de o pereche de etichete
<DIR> </DIR>. Listele directoare sunt la fel ca listele neordonate cu excepia
faptului c nu pot fi ncuibate iar eticheta <LI> nu are nici un atribut.
List directoare:
<DIR>
<LI>Mole</LI>
<LI>Foal</LI>
<LI>Vole</LI>
<LI>GOAL.!</LI>
</DIR>
- Liste de meniuri
O list de meniuri ar trebui s fie mprejmuit de o pereche de etichete
<MENU> </MENU>. Listele de meniuri sunt la fel ca listele neordonate, cu excepia
c ele pot fi ncuibate.
- Liste definite
Listele definite afieaz o list de articole, fiecare articol fiind o pereche de
genul termen definiie. Spre deosebire de celelalte tipuri de liste, listele definite
nu se folosesc de elementele <LI> </LI>, n schimb perechea de etichete <DT>
</DT> este folosit pentru a indica termenul, iar etichetele <DD> </DD> conin
definiia corespunztoare fiecrui termen. O list definit ar trebui inclus ntr-o
pereche de etichete <DL> </DL>. Exemplu:
Some definitions:
<DL>
<DT>plasma</DT>
<DD>definitie pentru plasma</DD>
<DT>thyristor</DT>
<DD>definitia tiristorului.</DD>

36

HTML - 1
</DL>
<DL COMPACT>
<DT>alt termen</DT>
<DD>definitia noului termen</DD>
</DL>

1.6. Mapri pe imagini


Maprile pe imagini const practic n delimitarea anumitor zone active pe
suprafaa unei imagini (crearea unei hri), sub forma unor regiuni de tip
referin-link, la al cror apelare (click) se execut o anumit operaie (de regul
ncrcarea unui document HTML, apelul unui script etc.). [1] Etichetele de baz
pentru realizarea unei mape pe o imagine sunt : <MAP>, <AREA>.
Alegnd o imagine convenabil, este necesar n primul rnd afiarea
graficului pe ecran i indicarea faptului, c referitor la respectiva imagine, exist
creat o mapare. Pentru a realiza acest lucru se folosete eticheta <IMG>, cu
atributul USEMAP. n continuare este necesar descrierea coordonatelor care
delimiteaz zonele active mapate i a aciunilor care se execut la apelul acelei
mape. Cu alte cuvinte, maparea unei imagini const n atribuirea unei anumite
aciuni diverselor regiuni ale unei imagini, pe care se face click cu mouse-ul.
Etichetele de baz prin care se realizeaz o mapare activ pe o imagine sunt
prezentate n continuare:
<MAP></MAP>
Aceast etichet conine definirea mapei i numele atribuit acesteia prin
proprietatea NAME: NAME="text"
<AREA>
Aceast etichet este folosit pentru a marca o arie a imaginii ca o zon
activ (creia i se mapeaz o anumit aciune), lucrnd practic ca o sub-etichet
a etichetei MAP. Nu exist o limitare a numrului acestor zone <AREA> n cadrul
unui MAP. Dac dou zone se intersecteaz, zona care apare prima n definirea
mapei este prioritar n regiunea de suprapunere.
SHAPE="rect | circle | poly | default"
Definete forma unei zone active mapate, ca dreptunghi, cerc, poligon sau
ca rest al imaginii rmas nedefinit (valoarea default). Setnd valoarea la default,
nseamn c eticheta <AREA> e aplicat n afara spaiului imaginii corespunztor
oricrei zone mapate.
HREF="URL"
Este folosit pentru a specifica o legtur destinaie (link-ul) pentru zona
activ. Are aceeai sintax ca i atributul HREF al etichetei <IMG>.
COORDS="x1,y1,x2,y2 | x,y,r | x1,y1,x2,y2,x3,y3..."
Definete poziia precis a unei zone mapate (active) folosind coordonatele
n pixeli, separate prin virgul. Un dreptunghi este descris prin coordonatele
colurilor stnga-sus i dreapta-jos. O zon circular este descris prin coordonatele
centrului, urmate de raza sa. Un poligon este definit de coordonatele tuturor
colurilor poligonului. Atributul COORDS este ntotdeauna necesar pentru atributul
SHAPE, exceptnd cazul cnd SHAPE este setat default.
NOHREF
Folosit pentru a specifica o zon care nu e n via.

1.6. Mapari pe imagini

37

ALT
Se folosete numai ncepnd cu Microsoft Internet Explorer 4. Este folosit
pentru a prevedea un mesaj (hint) pentru legtura care apare atunci cnd mouse-ul
trece deasupra zonei active.
TARGET="frame_name | window_name"
Acest atribut aloc destinaia unei legturi link, pentru a ncrca informaia
referita prin HREF ntr-un frame predefinit sau ntr-o fereastr. Dac nu este nici un
frame cu numele specificat, atunci legtura va fi ncrcat ntr-o fereastr nou
(care primete acel nume).
Exemplu (pentru Internet Explorer):
<IMG SRC="timis.jpg" USEMAP="#timis" BORDER=3>
<MAP NAME="timis">
<AREA SHAPE=RECT COORDS="11,121,329,548" HREF="vest.html" ALT="
vest Timis">
<AREA
SHAPE=RECT
COORDS="327,157,700,344"
HREF="ne.html"
ALT="nord-est Timis" >
<AREA
SHAPE=RECT
COORDS="328,344,685,570"
HREF="se.html"
ALT="sud-est Timis" >
</MAP>
Observaie: Referitor la exemplul anterior, n cazul unei rulrii pe un browser
Mozilla este posibil ca anumite atribute s nu aib efectul ateptat (spre exemplu
atributul ALT nu este funcional).
ntr-un paragrafele precedente se vorbea despre DHTML, adic de modul n
care chiar unele etichete HTML aduc o oarecare dinamic n statismul unei pagini
Web. n continuare sunt exemplificate cteva asemenea etichete.

1.7. Dinamic i multimedia. HTML 5


Unul dintre obiectivele majore ale fiecrei noi versiuni HTML a fost
mbuntirea dinamicii paginilor Web, asigurndu-le o interactivitate ct mai mare,
respectiv un design ct mai atractiv, n principal printr-o extindere a capabilitilor
multimedia. [3]
Cteva exemple care surprind aceste aspecte sunt punctate n continuare:
- Crearea unui blinking text
Limbajul HTML dispune de o etichet pentru a crea un text special ca
dinamic, care s sar n eviden atunci cnd un navigator acceseaz o anumit
pagin. Aceasta este eticheta <blink>, iar textul marcat de ea va nregistra un efect
dinamic de clipire:
<blink>Acesta este un text blink.</blink>
Observaie: Tag-ul <blink> este interpretat numai de browserele Mozilla, celelalte
neasigurnd o clipire a textului.
- Elementul de tip <marquee>
Dac se dorete o deplasare a unui text pe ecran, n genul unei reclame, un
alt tag poate fi utilizat rapid i eficient. Doar Internet Explorer suport eticheta
special <marquee> care asigur o defilare (scrolling display) pe ecran a oricrui text
ncadrat de ea.
<marquee> Dac folosii IE, textul trebuie s se deplaseze! </marquee>

38

HTML - 1

Observaie: Aceast etichet nu este suportat de alte browsere, acestea afind


ntregul text, fr ns a-l deplasa pe ecran.
- Etichete META destinate multimedia
Exemple de etichete META care asigur o dinamic a paginii Web, permind
redarea unor secvene multimedia video/audio:
<META HTTP-EQUIV="Refresh" CONTENT="3 clock.avi"></meta>
<META HTTP-EQUIV="Refresh" CONTENT="7 URL=utopia.wav">
<IMG dynsrc=Clock.avi loop=infinite>
Cifra care apare n interiorul atributului CONTENT, asigur un refresh
(rencrcare) a secvenei multimedia dup un interval de timp prestabilit.
- HTML 5
Ultima versiune HTML 5 vine cu o serie de facilitai care mbuntesc
performanele multimedia ale aplicaiilor Web. Astfel, dinamica unei pagini este mult
crescut prin introducerea unor noi etichete viznd partea audio, video i grafic,
tratarea erorilor este mai simpl i eficient, iar pentru o serie de etichete HTML
anterioare sunt modificate i specificaiile/atributele. [7] Totodat o serie de etichete
sunt abrogate. Spre exemplu, frame-urile nu mai sunt funcionale ntr-un document
HTML 5, iar eticheta <object> permind ncapsularea unor obiecte plugin pentru
diverse faciliti (n special multimedia) este i ea abrogat, fiind substituita cu noi
etichete HTML 5, gen <audio>, <video>. n momentul actual se poate vorbi de o
confruntare n zona Web multimedia ntre tehnologia HTML 5 funcionnd fr
plugin-uri adiionale (aplicaii software adiionale), respectiv tehnologia clasic
bazat pe plugin-urile Flash. Actualmente, browser-ele ntr-o proporie covritoare
suport Flash, n timp ce sub jumtate dintre ele suporta HTML 5. [23] HTML 5
implic o utilizare intensiv a altor tehnologii conexe bazate pe JavaScript, CSS,
Canvas avnd o deschidere, conectivitate i capacitate mult mai mare de integrare
cu noi tehnologii, ceea ce l plaseaz ca potenial ctigtor n confruntarea cu
tehnologia bazata pe clasicele plugin-uri. De menionat totui c n acest moment se
pare ca nici un browser Web nu suporta n totalitate HTML 5, pe cele mai bune
poziii situndu-se n acest sens Google Crome, Safari i Firefox 4. [7]
Cteva secvene de cod HTML 5 pentru simple exemplificri sunt punctate
n cele ce urmeaz:
- orice cod HTML 5 este precedat de o declaraie de tipul:
<!DOCTYPE html>
- rularea unei secvene video (inclusiv tratarea erorii de compatibilitate):
<video width="400" height="250" controls="controls">
<source src="film.mp4" type="video/mp4" />
Browser-ul nu suporta HTML5.
</video>
- rularea unui fiier de sunet:
<audio controls="controls">
<source src="sunet.ogg" type="audio/ogg" />
Browser-ul nu suporta HTML5.
</audio>
- definirea unui articol ca element afiat:
<article>
<h1>Internet Explorer 9</h1>
<p>Continut de afisat cu IE 9.</p>
</article>

1.7. Dinamic i multimedia. HTML 5 39


- i exemplele ar putea continua cu o list lung de noi etichete (mai
mult sau mai puin suportate de diverse browsere):
- <section> - definete o seciune a documentului,
- <progress> - indicator pentru progresul unui task,
- <canvas> - utilizat pentru generarea de grafic 2D on-line
(utiliznd adiional cod JavaScript) etc.
Avantajul HTML 5 privind integrarea facil cu o serie de alte tehnologii i
limbaje de programare Web rulnd pe partea de client, poate ns constitui un
handicap privind compatibilitatea cu multitudinea de browsere existente. Astfel,
utilizarea intensiv a limbajului JavaScript, n strns corelare cu noile etichete
HTML 5 cu toate problemele de compatibilitate funcie de tipul de browser
constituie un argument relevant n acest sens. Viitorul rmne s decid ctigtorul
n aceast confruntare.

1.8. Elemente CSS


Cascading Style Sheets (CSS) este practic un pseudo-limbaj de formatare,
utilizat pentru a descrie modul de prezentare a documentelor scrise ntr-un limbaj
bazat pe marcaje (HTML, XML etc.). [6] Fiierele CSS (foi de stil n cascad) permit
separarea coninutului HTML propriu-zis al unui document, de stilul de
afiare/formatare n pagin al acestuia. [9] Codul HTML se utilizeaz, de obicei, doar
pentru aranjarea coninutului n pagin, iar detaliile care in de afiare (culori,
fonturi, fundaluri, margini etc.) se realizeaz cu ajutorul CSS-urilor, acestea
aplicndu-se suplimentar peste codului HTML, n cadrul unui site Web. Cu alte
cuvinte, CSS-urile realizeaz separarea prezentrii paginii de structura sa efectiv.
Aplicarea foilor de stil n cascad asupra codului HTML se poate face n mai
multe moduri, putndu-se vorbi de:
- stiluri interne;
- stiluri externe;
- stiluri n linie;
- clase CSS.

1.8.1. Stiluri interne


n cazul utilizrii stilurilor interne, codul CSS se plaseaz n interiorul fiecrei
pagini HTML pe care se dorete s se aplice stilurile respective, ntre tag-urile
<head> </head>, dup cum se poate vedea n continuare:
<head>
<title>Exemplu utilizare stiluri interne</title>
<style type="text/css">Aici se definesc stilurile CSS</style>
</head>
Pentru exemplificare, se prezint un script HTML n care se utilizeaz stiluri
interne (fig. 1.8):
<html>
<head>
<title> Exemplu de utilizare a stilurilor interne!!! </title>

40

HTML - 1
<style type="text/css">
table {
font-family: "Edwardian Script ITC";
font-size: 36px;
color: #FFFFFF;
background-color: #0099FF;
border: 4px double #0033FF;
text-align: center;
}
</style>
</head>
<body>
<br><br>
<table align="center">
<tr>
<td>
Exemplu de utilizare a stilurilor interne!!!
</td>
</tr>
</table>
</body>
</html>

Fig.1.8. Exemplu folosire stiluri interne

Utiliznd aceasta metod de aplicare a CSS-urilor asupra codului HTML, dac


se dorete o schimbare a stilului de afiare (mrimea fontului, culoare, etc)
modificarea va trebui realizat n toate paginile care conin acel stil. innd cont de
aceste aspect, aceast metoda este indicat a fi folosit doar n situaia n care se
dorete stilizarea un numr mic de pagini, fiind destul de neproductiv o realizare
a acestor modificri pe zeci sau chiar sute de pagini ale unui site WEB.

1.8. Elemente CSS 41

1.8.2. Stiluri externe


Un fiier CSS extern poate fi scris cu orice editor simplu de text (Notepad,
Wordpad, etc) sau cu editoare specializate (gen Dreamweaver). Fiierul CSS nu
conine cod HTML, ci doar cod CSS i trebuie salvat cu extensia .css.
Referirea fiierului extern CSS n paginile HTML se face prin plasarea unui
tag link (legatur), n seciunea <head> </head> a fiecrei pagini n cadrul creia
se dorete aplicarea stilul respectiv, avnd forma urmtoare:
<link rel="stylesheet" type="text/css" href="Calea catre fisierul.css" />
n continuare, se prezint un exemplu de referire a unui fiier extern .css
ntr-o pagin HTML:
<html>
<title> Exemplu de utilizare a stilurilor externe!!! </title><head>
<link href="cssExt.css" rel="stylesheet" type="text/css">
</head>
<body>
Exemplu de utilizare a stilurilor externe in body!!!
<table>
<tr>
<td>
Exemplu de utilizare a stilurilor externe in tabel!!!
</td>
</tr>
</table>
</body>
</html>
Fiierul CSS referit i utilizat n pagina HTML anterioar (cssExt.css), se
consider a avea urmtorul coninut exemplificativ (efectul utilizrii lui putndu-se
observa n figura 1.9):
body
{
font-family: "Courier";
font-size: 26px;
color:#000000;
background-color:#B3B3B3;
text-align: center;
}
table {
font-family: "Edwardian Script ITC";
font-size: 46px;
color: #FFFFFF;
background-color: #0090FF;
border: 4px double #0033FF;
text-align: center;
}
Aceasta metod. de utilizare a unor fiiere de stil externe, este preferat n
momentul n care un site WEB conine un numr mare de pagini utiliznd aceleai

42

HTML - 1

reguli de stil, motivul fiind evident: atunci cnd se dorete modificare aspectului
ntregului site, este suficient doar o modificare ntr-o singur locaie, i anume fiierului CSS (efectul resimindu-se asupra tuturor paginilor din site care folosesc
foaia de stil respectiv). Astfel, printr-o singur operaie, se poate schimba rapid
aspectul ntregului site, indiferent de dimensiunea lui (numr de pagini).

Fig.1.9. Exemplificare stiluri externe

1.8.3. Stiluri n linie


Stilurile n linie se definesc chiar n codul etichetei HTML aferente elementului
care se dorete a fi stilizat, dup cum se poate vedea n exemplul urmtor
(fig.1.10):
<body>
<p style="color: #00ddff; font-size: 20;">Titlu</p>
<h2 style="font-size: 16;font-weight: bold; color: #ff3300;">Exemplu
utilizare stiluri in linie!!! </h2>
</body>

Fig.1.10. Exemplificare stiluri n linie

1.8. Elemente CSS 43


Stilurile n linie sunt mai puin utilizate, deoarece ele nu permit schimbri
rapide de stil pe mai multe fiiere n acelai timp, modificrile trebuind realizate pe
fiecare element n parte, i n fiecare pagin n parte.
Anterior au fost prezentate trei metode de aplicare a CSS-urilor asupra
codului HTML. n situaia n care, se folosesc dou sau chiar trei metode n acelai
timp, se pune ntrebarea: care este ordinea/prioritatea folosirii lor pentru o
interpretare corect de ctre browser? Rspunsul este: metodele se vor executa n
cascad, n ordinea urmtoare: prima oar -stilurile n linie, urmate apoi de stilurile
interne, iar n final - stilurile externe, aceasta fiind i ordinea lor de prioritizare.
Evident, un element deja stilizat, spre exemplu, cu un stil linie, nu este restilizat de
o regul de stil existent ntr-un fiier CSS extern, acionnd imediat ulterior
conform regulii de prioritizare anterior enunate.

1.8.4. Clase CSS


Clasele CSS se utilizeaz pentru stilizarea n mod difereniat a unor mulimi
de tag-uri HTML (distribuite n una sau mai multe pagini WEB). Acest mod de lucru
este similar cu utilizarea stilurilor n linie, avantajul major fiind acela c atunci cnd
se dorete efectuarea unei modificri de stil pe mai multe elemente/pagini, aceasta
nu trebuie efectuat individual la nivelul fiecrui element. [8] Astfel, este suficient
o modificare n cadrul clasei CSS care definete stilurile respective, efectul acesteia
rsfrngndu-se asupra tuturor elementelor pe care acioneaz clasa respectiv. [5]
Definirea unei clase CSS ncepe cu semnul punct (.), dup care urmeaz
numele clasei. Se recomand folosirea unor denumiri sugestive pentru numele
clasei, care s indice ce anume face stilul respectiv. O clas CSS poate fi folosit n
cadrul unui fiier HTML ori de cte ori este nevoie. Iat un exemplu de clas care
stabilete dimensiunea i culoarea unui text:
.text20albastru
{
font-size: 20px;
color: 00ddff;
}
Pornind de la exemplificarea din la paragraful Stiluri n linie, se prezint
modul de de definire i utilizare a unor clase CSS ntr-un document HTML, clasele
fiind stocat ntr-un fiier de stil extern:
- Fiierul HTML utiliznd stiluri externe bazate pe clase:
<head>
<title> Exemplu de utilizare a stilurilor in linie!!! </title>
<link href="claseCSS.css" rel="stylesheet" type="text/css">
</head>
<body>
<p class="text20albastru">Titlu</p>
<h2 class="text16rosu">Exemplu utilizare stiluri in linie!!! </h2>
</body>
- Fiierul CSS (claseCSS.css) n care sunt definite cele dou clase (ambele
stiliznd texte, dar n mod diferit):

44

HTML - 1
.text20albastru
{
font-size: 20px;
color: 00ddff;
}
.text16rosu
{
font-size: 16px;
font-weight: bold;
color: ff3300;
}

Stilizarea obinut n cadrul fiierului HTML anterior prezentat este evident


identic cu cea obinut prin utilizarea stilurilor n linie (fig. 1.10 ).
Ca o concluzie, n contextul dezvoltrii unor aplicaii Web tot mai complexe,
coninnd un numr tot mai mare de pagini, i implicit de fiiere script, stilurile CSS
constituie la ora actual strategia consacrat, de maxim eficien, pentru
formatarea i designul primar al acestora.

1.8.5. Meniuri create cu CSS


Una dintre aplicabilitile cele mai uzuale ale CSS-urilor const n crearea de
meniuri necesare navigrii ntr-o aplicaie, att foarte simple, ct i cu o
complexitate deosebit. Scheletul HTML (ca fundament al unui meniu) pe care sunt
aplicate stilurile CSS, consist n structuri de tip list (folosindu-se etichete pentru
crearea unor liste neordonate <ul>, mpreuna cu elementele lor constituente <li>),
ncapsulate eventual ntr-un DIV, respectiv hyperlink-urile aferente (ancore <a>).
Din pcate dependena de browser se face resimita i n cazul utilizrii de stiluri
CSS, astfel nct (mai ales pentru meniuri mai complexe), este foarte posibil ca un
meniu care funcioneaz pe o familie de browsere, s nu fie complet funcional pe o
alta. ntr-un astfel de caz, soluia de rezolvare const n apelarea suplimentar a
unor scripturi JavaScript.
Exemplul urmtor, utiliznd doar CSS (fr elemente JavaScript),
implementeaz un meniu simplu (fr submeniuri vezi fig. 1.11), fiind funcional
att pe Mozilla, ct i pe Internet Explorer. Pentru crearea meniului s-a utilizat un
fiier extern CSS, n care sunt definite mai multe stiluri.
Fiierul HTML (aferent unui meniu cu trei opiuni) are urmtorul cod:
<link href="meniu-html.css" rel="stylesheet" type="text/css">
<div id="nav-menu">
<ul>
<li><a href="#">Optiune1</a></li>
<li><a href="#">Optiune 2</a></li>
<li><a href="#">Optiune 3</a></li>
</ul>
</div>

1.8. Elemente CSS 45

Fig.1.11. Meniu creat cu CSS

Fiierul implementnd stilurile externe CSS (meniu-html.css) conine urmtoarele


elemente de stilizare:
#nav-menu ul
{
padding: 0;
margin: 0;
}

Fig.1.12.a Efect doar cu #nav-menu ul

#nav-menu li
{
float: left;
margin: 0 0.4;
background:#B3B3B3;
}

Fig.1.12.b Efect cumulat cu stilul


#nav-menu ul li

#nav-menu li a
{
background: url(background.jpg) #fff bottom left repeat-x;
height: 2em;
line-height: 2em;

46

HTML - 1
float: left;
width: 9em;
display: block;
border: 0.1em solid #dcdce9;
color: #FFFFFF;
text-decoration: none;
text-align: center;
}

Figurile 1.12.a, respectiv 1.12.b prezint efectul succesiv cumulat al fiecrui nou
element de stil aplicat (ultimul conducnd chiar la meniul final din fig. 1.11).
n cadrul fiierului CSS se poate remarca referirea #nav-menu specificnd id-ul
elementului DIV (nglobnd ntreaga construcie a meniului). Cele trei stiluri #navmenu ul, #nav-menu li, #nav-menu li a, se refer la formatarea listelor (ul)
avnd ca printe DIV-ul (#nav-menu), a elementelor listelor (li), respectiv a
coninutului ancorelor (a) , avnd ca printe elemente ale listei (li), care la rndul
lor au ca printe DIV-ul (#nav-menu).
Dei rulnd codul anterior pe Mozilla, unele stiluri ar putea prea inutile, o simpl
rulare pe Internet Explorer este relevant pentru a dovedi necesitatea lor! Spre
exemplificare, eliminarea stilului aferent elementelor din lista (#nav-menu li)
conduce pe Internet Explorer la un meniu de genul celui din fig. 1.13.

Fig.1.13 Efect fr #nav-menu li rulare cu Internet Explorer

Un exemplu de meniu mai complex, avnd i sub-meniuri (drop-down


este prezentat n cele ce urmeaz [38]. ntregul cod, att lista HTML, ct i
CSS (ca stiluri interne), sunt integrate ntr-un acelai fiier HTML. Efectul
nou element CSS succesiv adugat este prezentat n figurile 1.14.a1.14.h.
figur fiind alturat secvenei de cod CSS nou adugat).
<ul id="menu">
<li><a href="#">Unu</a></li>
<li><a href="#">Doi</a>
<ul>
<li><a href="#">Doi-1</a></li>
<li><a href="#">Doi-2</a></li>
<li><a href="#">Doi-3</a></li>
</ul>
</li>

menu),
stilurile
fiecrui
(fiecare

1.8. Elemente CSS 47


<li><a href="#">Trei</a>
<ul>
<li><a href="#">Trei-1</a></li>
<li><a href="#">Trei-2</a></li>
</ul>
</li>
</ul>
<style type="text/css">
ul
{
font-family: Arial, Verdana;
font-size: 14px;
margin: 0;
padding: 0;
list-style: none;
}

Fig.1.14.a Stilizare liste <ul>

ul li
{
display: block;
position: relative;
float: left;
}

Fig.1.14.b Stilizare elemente liste <li>


(avnd ca printe liste <ul>)

48

HTML - 1
li ul
{
display: none;
}

Fig.1.14.c Stilizare liste <ul> (doar


cele avnd ca printe elemente <li>) n
cazul de fa ascunderea lor

ul li a
{
display: block;
text-decoration: none;
color: #ffffff;
border-top: 1px solid #ffffff;
padding: 5px 15px 5px 15px;
background: #1e7c9a;
margin-left: 1px;
white-space: nowrap;
}

Fig.1.14.d Stilizare ancore <a> avnd


ca printe elemente list <li>, care la
rndul lor au ca printe liste <ul> (practic
toate ancorele meniului, inclusiv cele
ascunse)

ul li a:hover
{
background: #3b3b3b;
}
// hover element selector ataat
unei etichete HTML, genernd, n
momentul n care mouse-ul se
deplaseaz deasupra acesteia, o
stilizare fie a acesteia, fie a altei
etichete.
// ul li a:hover - cnd mouse-ul se
deplaseaz deasupra unei ancore <a>
(etichet selectat), modific fundalul
ancorei avnd ca printe un element
<li>, care la rndul face parte dintr-o
list <ul>.

Fig.1.14.e Stilizare elemente <li> (cele


vizibile) avnd ca printe liste <ul> (setare culoare background/ fundal la
deplasare mouse deasupra ancorelor <a>)

1.8. Elemente CSS 49


li:hover ul
{
display: block;
position: absolute;
}
// li:hover ul - cnd mouse-ul se
deplaseaz deasupra unui element <li>,
afieaz elementul <ul> (avnd ca
printe acel <li>)

Fig.1.14.f Afiare submeniu la o


deplasare mouse deasupra unui element
<li> avnd ca printe o list <ul> (practic
anuleaz ascunderea)

li:hover li {
float: none;
font-size: 20px;
}
// li:hover li - cnd mouse-ul se
deplaseaz deasupra unui element <li>,
stilizeaz acel <li> (avnd ca printe alt
<li>)
//aici s-ar putea opri dezvoltarea
meniului

Fig.1.14.g La o deplasare deasupra


unui element list < li> - setare scris mai
mare

li:hover a {
background: #00ff00;
color: #ff00ff;
}
//simple schimbri de culori (nu sunt
necesare)
</style>

Fig.1.14.h La o deplasare deasupra


unui <li> - setare culoare scris i fundal
ancor <a>

50

HTML - 1

Observaie: Din pcate, meniul anterior prezentat funcioneaz integral doar pe


Mozilla, i doar parial pe Internet Explorer (sub-meniurile nefiind active).
Rezolvarea const n utilizarea de cod suplimentar JavaScript. [38]
Primul exemplu din acest paragraf fcea referire la o etichet DIV, definind o
diviziune (seciune) a unui document HTML, des utilizat mpreun cu elemente
CSS. Oarecum echivalent cu DIV, eticheta SPAN permite i ea o ncapsulare a unor
elemente ntr-o seciune a unei pagini HTML. Deosebirile majore ntre cele dou
etichete sunt urmtoarele:
- DIV - permite formatarea ntregii seciuni delimitate (folosind stiluri CSS);
- SPAN - nu permite o formatare a seciunii delimitate de el, ci doar a
elementelor (de regul, a textului) incluse n el. n plus, un SPAN este precedat
implicit de un paragraf nou, ncepnd pe o linie nou (mai puin cazul n care este
inclus ntr-un DIV ).
Codul urmtor (vezi i figura 1.15), este relevant pentru evidenierea
caracteristicilor celor doua etichete (DIV i SPAN):
<div id="mydiv" style="color: blue; background: yellow">Ceva text in Div 1
<span style="color: red; background: white"> Ceva text in Span 1 (integrat
intr-un DIV -fara paragraf nou) </span>
Tot text in Div 1.
</div>
<span style="color: white; background: red">Span extern 2 (se observa ca
incepe cu paragraf nou)</span>
<h3>Inainte de Span 3 <span style="color: red;background: yellow">Continut
Span 3 </span> Dupa Span 3</h3>
<span style="color: red; background: yellow; line-height: 10em">Continut
Span 4 -stilizare doar continut efectiv </span>

Fig.1.15 Exemplificare DIV i SPAN

Stilizarea obinut n cadrul fiierului HTML anterior prezentat este evident

2. PHP
2.1. Preliminarii
Unul dintre cele mai utilizate limbaje de programare folosit la ora actual
pentru dezvoltarea aplicaiilor Web este PHP-ul (semnificaia acronimului PHP fiind PHP: Hypertext Preprocessor). PHP-ul este un limbaj de scripting derivat din
familia C, rulnd multiplatform (att pe paltformele Windows, ct i Unix-Linux),
permind dezvoltarea rapid de scripturi server-side de ctre orice programator
familiarizat cu binecunoscutul i popularul limbaj C. [10][20]
Ca software open-source i avnd o robustee confirmat n cei aproape 20
de ani de utilizare, PHP-ul prezint un cert avantaj n puternica competiie pe care o
are cu alte limbaje i tehnologii de programare Web server-side, cum ar fi ASP,
ASP.Net, JavaServer Pages (JSP) etc. Evident, fiind un limbaj rulnd pe partea de
server (de aceea se face o comparaie a acestuia doar cu acest tip de limbaje de
programare Web), scripturile PHP sunt rulate pe un server Web (folosind motorul
interpretor PHP), iar utilizatorul (clientul browser) nu poate vedea codul surs PHP al
programului, ci doar codul paginii HTML returnat spre browser-ul client. Altfel spus,
motorul limbajului interpreteaz codul surs program PHP, genernd pe baza
acestuia cod HTML (integrat cu datele / informaiile utile returnate/generate), pasat
apoi mai departe de ctre serverul Web spre browser-ul apelant, care tie s
interpreteze/afieze corespunztor codul HTML. Un alt mare avantaj al PHP-ului
const n faptul c suport o mare varietate de tipuri de baze de date, cum ar fi
MySQL, Oracle, PostgreSQL, IBM DB2, InterBase, Sysbase, Microsoft SQL Server
(suportul pentru MySQL fiind ncorporat nativ n interpretorul PHP). [12] Astfel, se
pot crea foarte uor aplicaii Web pentru accesarea bazelor de date, PHP-ul oferind
fie suport nativ, fie un suport concretizat prin utilizarea unor biblioteci .dll
suplimentare externe (programatorul trebuind s utilizeze selectiv biblioteci specifice
tipului respectiv de baz de date). [19] Alt avantaj este faptul c suport o serie de
protocoale de reea, printre care SMTP, NNTP, POP3 i HTTP. n cadrul lucrrii de
fa s-a folosit versiunea PHP 5.2.3. n momentul redactrii, ultima versiune PHP
5.4.4 era disponibil on-line la adresa www.php.net.
Limbajul de scripting PHP a fost implementat n 1994 de Rasmus Lerdorf, la
nceput fiind vorba de un proiect personal care includea cteva macro-uri i un
modul care permitea interpretarea lor, menite s urmreasc "activitatea" paginii
sale personale. n 1995 este disponibil sub numele Personal Home Page. ncepnd
cu versiunea 3, din 1997, a nceput s fie dezvoltat de o echip de programatori, iar
ncepnd cu versiunea 4 dispune de engine-ul de scripting al firmei Zend

52

PHP - 2

Techologies. Exist multe clasamente la ora actual privind popularitatea limbajelor


de programare, fiecare avnd diverse criterii luate n calcul, iar o simpl cutare pe
Internet poate gsi o multitudine de asemenea surse viznd aceste clasamente. Din
acest motiv, fr a cita explicit o anumit surs, se poate afirma c PHP este
probabil cel mai folosit limbaj de programare Web pe parte de server, surclasndu-i
momentan toi concurenii prin pre, robustee i longevitate, simplitate i vitez,
posibilitate de integrare cu alte tehnologii (inclusiv baze de date), securitate,
portabilitate, instalare facil etc. [24]
Observaie: Limbaje (sau pseudo-limbaje) uzual folosite n programarea WEB:
HTML-CSS, PHP, ASP.NET, JavaServer Pages, JavaScript, Perl etc. Pe partea de
client ruleaz: HTML, JavaScript. Pe partea de server ruleaz: PHP, ASP.NET,
JavaServer Pages, Perl. De asemenea, CSS poate fi considerat ca un pseudo-limbaj
de formatare, utilizat pentru a descrie modul de prezentare / afiare a documentelor
descrise printr-un limbaj bazat pe marcaje (HTML, etc.).
Capitolul de fa ncearc o prezentare sintetic, concis a elementelor de
baz ale limbajului PHP, punndu-se un accent special pe operarea cu baze de date
de tip MySQL, respectiv Oracle, nsoite de exemplificri i aplicaii concrete. Scopul
este cel de a familiariza programatorul cu caracteristicile eseniale ale limbajului,
permindu-i dezvoltarea rapid a unor aplicaii Web, n contextul unei integrri cu
HTML i MySQL. Utilizarea PHP, fiind un limbaj server-side, necesit un server de
WEB. Toate exemplele prezentate n continuare au fost rulate folosind ca server de
WEB, fie Apache, fie Internet Information Services (IIS), numit uneori formal i
Internet Information Server.

2.2. Instalare
Alt avantaj major al PHP l constituie instalarea extrem de facil, n contextul
unei conexiuni att cu serverul de Web Apache, ct i cu serverul de baze de date
MySQL. Astfel, cel mai simplu mod de a opera cu PHP-ul, n tandem cu MySQL i
Apache, este de a folosi pachetul WAMP, integrnd perfect aceast triplet
PHP+MySQL+Apache i disponibil la adresa www.wampserver.com/en/. Dup simpla
rulare a kit-ului de instalare WAMP, totul este deja pregtit pentru a scrie i rula
scripturi PHP (inclusiv cu apeluri la serverul de baze de date MySQL), fr a mai fi
necesar nici o alt setare suplimentar (n fiierele de configurare).
Observaie: De remarcat faptul c, la un moment dat, pe un calculator poate rula
doar un server Web, astfel nct, dac un alt server este deja instalat i pornit, este
necesar o oprire prealabil a acestuia.
Pachetul WAMP conine i aplicaiile PHPMyAdmin i SQLiteManager,
folosibile pentru gestionarea cu uurin a bazelor de date MySQL. WAMP este
pachetul destinat operrii sub Windows. [21] n mod similar se poate folosi LAMP
pentru operarea sub Linux. Cu aceleai avantaje, se poate folosi i pachetul XAMP
(Xml + Apache + Mysql + Php), oferind faciliti similare.
n cazul n care se utilizeaz componente disparate (interpretor PHP, server
WEB, server de baze de date SQL), iar pe computer nu este instalat un server de
WEB, este iniial necesar instalarea unuia. Versiunile mai vechi PHP (pn la 3)
erau disponibile doar ca pachet separat, integrarea lor cu un server de Web,
respectiv server MySQL fcndu-se manual, printr-o serie de setri n diverse fiiere
de configurare (n principal fiierul php.ini), respectiv o setare corespunztoare a
serverului de Web (n special n cazul IIS).

2.3. Comenzi PHP

53

De asemenea, realizarea unor anumite aplicaii care necesit alte resurse


conexe pachetului de baz PHP (biblioteci sau extensii), implic o configurare a PHPului prin diverse setri corespunztoare n fiierul php.ini. Spre exemplu, pentru
accesarea bazelor de date de tip Oracle este necesar ca extensie fiierul
php_oci8.dll, iar pentru InterBase - fiierul php_interbase.dll (aceste biblioteci
nefiind preinstalate implicit din motive de evitare a suprancrcrii serverul Web,
fiind vorba de fiiere .dll care rmn rezidente n memorie). Operaia de instalare a
acestor biblioteci este simpl. Pentru cazul anterior menionat, spre exemplu, este
necesar doar identificarea bibliotecilor extensie necesare, urmat de o simpl
necomentare (eliminarea caracterului de comentariu ;), n fiierul de configurare
php.ini, a liniilor pe care apar referite aceste fiiere din seciunea Windows
Extensions: (n cazul de fa php_interbase.dll sau php_oci8.dll)
;Windows Extensions
;Note that ODBC support is built in, so no dll is needed for it.
extension=php_interbase.dll
...
extension=php_oci8.dll
Observaie: Coninutul fiierului php.ini (i implicit starea variabilelor de
configurare ale PHP) poate fi vizualizat printr-un apel al funciei PHP phpinfo( ) .
Dup o operaie de reconfigurare (modificare a fiierului php.ini) este
necesar o restartare a serverului Apache (sau a oricrui server Web folosit) pentru
ncrcarea i a acestor noi biblioteci. Toat configurarea manual anterior descris
poate fi fcut i utiliznd opiunile meniul grafic pus la dispoziie de WAMP dup
instalare. O serie de alte configurri necesare a fi realizate n fiierul de configurare
php.ini vor fi precizate pe paragrafele urmtoare, funcie de contextul folosirii altor
biblioteci extensie, respectiv funcie de modul de setare al interpretorului PHP (spre
exemplu, pentru realizarea unor configurri de securizare eficiente prin setarea
corespumztoare a unor variabile speciale care, n cele mai multe cazuri, sunt
realizate adecvat, implicit la instalare).
Exemplele din paragrafele urmtoare (opernd, cele mai multe, cu baze de
date MySQL) au fost rulate utiliznd pachetul WAMP5 versiunea 1.7.2 care conine
n pricipal:
- Apache 2.2.4 (Win32), PHP 5.2.3, MySQL 5.0.22
- PHPMyAdmin, SQLiteManager, alte opiuni grafice de setare/configurare.
Codul PHP fiind interpretat pe partea de server Web (Apache, IIS, etc), nu
prezint nici o dependen fa de browser-ul client (Internet Explorer, Mozzila,
Netscape, FireFox, Opera, Chrome, etc.).
Verificarea instalrii cu succes a
pachetului WAMP (i a startrii serverului Web) se poate face printr-un simplu apel
la adresa: http://localhost/. Locaia de plasare pe serverul Apache (instalat prin
intermediul pachetului WAMP) a surselor cod PHP este C:\wamp\www, iar rularea
unui fiier script.php, plasat aici, se face printr-un apel de forma
http://localhost/script.php (evident din browser-ul Web).

2.3. Comenzi PHP


2.3.1. Sintax i elemente de baz
Sintaxa comenzilor elementare PHP este extrem de asemntoare cu a altor
limbaje structurate, precum C, JavaScript, Perl (mai precis cu a comenzilor oricrui

54

PHP - 2

limbaj derivat din familia C, mprumutnd ns cte ceva i de la limbajul Perl, n


special pe partea de operare cu string-uri de date). Se vorbete despre comenzi
elementare ca fiind acele comenzi care constituie nucleul de baza al oricrui limbaj
de programare, dificultatea majora nefiind operarea cu acestea (n numr relativ
limitat), ci mai degrab constnd n cunoatere multitudinii de biblioteci extensie, a
funciilor oferite de acestea pentru dezvoltarea diverselor tipuri de aplicaii i
funcionaliti.
Dei PHP dispune i de capabiliti specifice programrii orientate pe obiecte
(n special pentru versiunile mai noi, aa cum se va vedea ntr-un paragraf urmtor
al prezentului capitol), exemplele imediat urmtoare consider cazul unei abordri
structurate (utilizarea lui ca limbaj structurat fiind de altfel cea consacrat). Un
script PHP const ntr-o serie de comenzi, executate secvenial, una cte una, de
ctre interpretorul PHP i al cror rezultat (date+cod HTML) este pasat spre un
server Web. O eventual eroare aprut este semnalat de interpretor i afiat de
browser (chiar la apelul scriptului), fr blocarea execuiei comenzilor urmtoare.
Fiecare comand se ncheie cu caracterul punct-i-virgul (;). Ca aplicaie
introductiv, se prezint codul celui mai simplu program PHP, echivalentul clasicul
Hello, World din C (integrnd opional i cod HTML):
<html>
<body>
<?php echo Hello, World !!!; ?>
</body>
</html>
Se observ prezena unui tag pereche special, <?php ?>, care ncadreaz
/delimiteaz codul PHP. Funcia echo asigur tiprirea pe ecran a irului specificat ca
parametru. PHP permite utilizarea i a altor sintaxe pentru definirea unei zone de
cod sau chiar sintaxe diferite pentru referirea parametrului string al funciei de
afiare echo:
<?php Echo ("acesta este un simplu test 1\n"); ?>
<?php echo acesta este un simplu test 2<br>;?>
<script language="php">
echo ("Un alt exemplu de delimitare cod PHP");
echo "Inca un exemplu de de afisare a unui mesaj";
</script>
Totui, cea mai rspndit sintax (folosit i n lucrarea de fa) este cea
utiliznd perechea de etichete <?php ?>, fiierul sursa avnd extensia .PHP
(extensie implicit recunoscut de serverul Apache - instalat integrat cu WAMP- care
va pasa automat un fiier script cu aceasta extensie spre interpretorul PHP).
Orice linie de comand, dup cum s-a mai menionat, folosete ca
terminator de linie caracterul ;, la fel ca n C sau Java. Comentariile, de
asemenea, mprumut sintaxa C, adic // pentru o linie individual, respectiv /* */
pentru o secven de cod nglobnd mai multe linii.
Se consider nc un exemplu pentru a evidenia cteva din caracteristicile
limbajului (utiliznd de data aceasta i funcia echivalent print n loc de echo, cu
acelai efect de afiare n browser a unei informaii /cod HTML):
<html>
<head>
<title>Data curenta</title>
</head>
<body>
<b>Data curenta este: </b>

2.3. Comenzi PHP

55

<?php
// se va afisa data calendaristica
echo "<p><b>";
print( date("d F Y, l. ") );
?>
</b> </body>
</html>
Efectul rulrii acestui script este prezentat n figura 2.1:.
Dei secvena anterioar ncepe cu cod HTML i conine cod HTML n mare
msur, codul PHP constnd practic n doar dou linii, fiierul surs va avea
obligatoriu extensia PHP (vezi n fig.2.1, linia de apel: localhost/data.php) Liniile
dintre etichetele delimitatoare <?php, respectiv ?> reprezint codul PHP. Serverului
WEB detecteaz extensia fiierului, apoi trimite i cere motorului PHP instalat pe
acelai localhost s interpreteze codul dintre cei doi delimitatori. Interpretorul PHP
execut funcia date prin care citete data calendaristic de pe server (localhost) si,
integrnd-o ca pe un simplu string n codul HTML, trimite rezultatul astfel construit
(date+cod HTML) spre browser-ul apelant.

Fig. 2.1. Data curent (preluat de pe sistemul host al serverului Web)

Browser-ului i se prezint un cod HTML curat, integrnd sub forma unei


informaii de tip ir de caractere (string) date curent (cod HTML vizibil cu opiunea
View source):
<html>
<head>
<title>Data curenta</title>
</head>
<body>
<b>Data curenta este: </b>
<p><b>02 July 2012, Monday. </b>
</body>
</html>
De remarcat c orice urm de cod PHP dispare, singura indicaie asupra
existentei acestuia fiind extensia fiierului script apelat. n locul acestuia, secvena
vizibil este un simplu cod HTML standard. Exemplul scoate n eviden cteva
avantaje majore ale script-urilor rulate pe partea de server:
a) Eliminarea problemelor de incompatibilitate viznd tipul de browser
(specifice limbajelor client-side). Scriptul este rulat pe partea de server unde este

56

PHP - 2

instalat i interpretorul PHP-, deci nu pot aprea probleme legate de tipul de


browser folosit pe partea de client.
b) Acces la resursele de pe partea de server. Dac aceeai aplicaie ar fi fost
scris n JavaScript, data respectiv ar fi fost data corespunztoare calculatorului
client (pe care ruleaz browser-ul). Pentru o informaie precis i unitar privind
data sau momentul de timp al apelului, informaia preluat de pe server este
singura demn de luat n considerare. Un alt exemplu n acest sens, vizeaz o
aplicaie Web cu baze de date, unde este foarte clar c baza de date (comun
tuturor apelanilor aplicaiei Web) trebuie plasat pe partea de server (chiar dac,
fizic, acest server SQL are alt remote host dect cel al serverului Web pe care
ruleaz codul PHP).
c) Reducerea ncrcrii clientului. Rularea unui script pe partea de client (cazul
JavaScript) poate fi destul de lent, depinznd direct de performanele calculatorului
care gzduiete browser-ul client. n cazul script-urilor rulate pe partea de server,
performanele calculatorului client nu mai prezint o importan decisiv privind
viteza de accesare a paginii Web.

2.3.2. Tipuri de date


Principale tipurile de date suportate de PHP sunt: integer, string, float,
boolean, array, object, null. Spre deosebire de alte limbaje de programare (chiar
cele din fanilia C), nu este necesar o declarare prealabil a unei variabile (i
evident o definire a tipului acesteia). Numele variabilelor sunt precedate de
caracterul "$", fcndu-se diferen ntre literele mari i mici folosite n cadrul
numelor de variabile. Exemplul urmtor este relevant n acest sens :
<?php
$var = "Ion";
$Var = "Dan";
echo "$var, $Var";
//se afieaz: Ion, Dan
echo $var, $Var;
//se afieaz: IonDan
echo $var, $Var;
//se afieaz: $var,$Var
?>;
Se poate remarca i faptul c, funcie de tipul de ghilimele simple, duble sau
lipsa acestor, comanda echo interpreteaz n mod diferit coninutul variabilelor de
afiat (ghilimele simple fornd o interpretare ad-literam -ca simplu string- a
coninutului, chiar dac caracterul $ indic prezena unor variabile care ar trebui
interpretate ca i coninut i nu ca i nume ).
O caracteristic remarcabil privind tipurile de date n PHP o constituie faptul
c tipul unei variabile este decis n momentul execuiei unei operaii asupra
acesteia. Aceast operaie poate fi o simpl atribuire a unei valori (tipul valorii sau
modul ei de furnizare dictnd tipul variabilei) sau o operaie propriu-zis care poate
chiar modifica tipul iniial al variabilei. [25] Se poate uor concluziona c o variabil
i poate schimba tipul pe parcursul rulrii unui script.. De asemenea, nu mai sunt
posibile binecunoscutele erori de conversie de tip specifice majoriti celorlalte
limbaje de programare. Aceast caracteristic este benefic limbajului PHP prin
prisma funcionalitilor lui principale de operare cu string-uri de date, trimise spre
browser pentru construcia i afiarea unei pagini Web (i evident, ne benefic altor
limbaje orientate spre cu totul alt gen de aplicaii).
Urmtorul exemplu, viznd cele anterior menionate, este relevant n acest
sens:

2.3. Comenzi PHP

57

$var = "0";
// $var = "0"
string
$var++;
// $var = "1"
$var+=1;
// $var = 2
integer
$var += c;
// $var = 2
integer
$var = $var + 1.3;
// $var = 3.3
float
$var = 5 + "10 obiecte";
// $var =15
$var = 5 + "obiecte";
// $var =5
integer
$var = "a";
// $var = "a"
string
$var++;
// $var = "b"
$var = "nu";
// $var = "nu"
string
$var++;
// $var = "nu"
string
Comentariile prezente n dreptul fiecrei linii precizeaz valoarea variabilei
($var) dup operaia efectuat, respectiv tipul acesteia (n multe cazuri fiind vorba
de o schimbare de tip, fr a se semnala o eventual eroare, chiar i pentru cele
mai puin probabile situaii de conversie de tip). Ultimele dou linii prezint cazul cel
mai defavorabil, n care operaia nu este posibil, situaie n care coninutul i tipul
variabilei rmne neschimbate.
Pentru tipul array sau ir (elementele unui ir putnd fi chiar de tipuri
diferite, ceea ce constituie iari o abatere de la regulile specifice altor limbaje
puternic tipizate), un exemplu edificator este prezentat n continuare:
$sir=array(1=>ion, 2=>dan, 3=>225);
echo $sir[1]."<br>";
// afieaz ion
(string)
echo $sir[2]."<br>";
// afieaz dan
(string)
echo $sir[3]."<br>";
// afieaz 125
(ntreg)
$sir[3]++;
// incrementeaz
echo $sir[3]."<br>";
// afieaz 226 (ntreg)
Eticheta <br> realizeaz afiarea pe o linie nou, iar operatorul . (punct)
este folosit pentru concatenarea a dou string-uri). Un element al irului poate fi
referit
independent,
ca
o
variabil,
printr-o
construcie
de
genul:
$nume_array[indice_element].
Secvena anterioar de cod poate fi rescris echivalent:
$sir=array(ion, dan, 225);
echo $sir[0]."<br>";
echo $sir[1]."<br>";
echo $sir[2]."<br>";
$sir[3]++;
echo $sir[2]."<br>";
n acest caz se poate observa c, dac irul este iniializat fr o precizare
explicit a indicilor elementelor, primul indice -cel de start- are valoarea implicit 0
i NU 1 (situaie des ntlnit pentru array-uri generate automat de unele
comenzi/structuri PHP).
Despre tipul boolean, o simpl exemplificare cu cele dou valori posibile:
$var=TRUE; //sau $var=false;
n plus, o eventual conversie la boolean a unei valori numerice 0, string 0
sau array vid (fr elemente), conduce automat la valoarea FALSE (restul de valori
non-zero, genernd TRUE).

58

PHP - 2

Asupra tipului object se va reveni ntr-un paragraf urmtor dedicat exclusiv


abordrii din punct de vedere al programrii orientate pe obiecte (new fiind
cuvntul cheie folosit pentru creare unui obiect nou, obinut prin instanierea unei
clase).
Tipul NULL este un tip mai special, semnificnd practic existena unei
variabile fr nici o valoare atribuit explicit (printr-un abuz de terminologie, o
variabil declarat, dar neiniializat). Exemplu:
<?php
$var;
echo $var;
?>
n contextul unei variabile de acest tip (NULL), este util exemplificarea
modului de interpretare a coninutului ei de ctre funciile isset, empty, is_null (mai
precis, rezultatul boolean returnat de aceste funcii):
isset($var)
//returneaz FALSE (variabil fr o valoare)
empty($var)
//returneaz TRUE (variabil vid)
is_null($var)
//returneaz TRUE (variabil nul)
Spre deosebire de o variabil, avnd numele precedat de caracterul $, o
constant se definete printr-o comanda de genul:
define("constanta", valoare);
Valoare acesteia nu poate fi modificat ulterior definirii i iniializrii, iar
referirea la ea se face direct prin numele ei (fr a fi nevoie de precedarea acestuia
de caracterul $). Spre exemplu:
define("increment", 10);
$var=100;
$var=$var+increment;
// $var=110
Observaie: Cea mai ampl i complet surs de documentare privind
limbajul PHP o constituie manualul on-line al acestuia, accesibil la adresa
http://php.net/manual/en/. Evident, descrierea sintaxei comenzilor, funciilor i a
unor structuri de programare tratate n capitolul de fa folosete ca surs primar
de documentare acest manual, venind ns n completarea lui printr-o manier
sintetic de prezentare selectiv i exemplificare a unora dintre cele mai importante
i uzuale comenzi/structuri. [20] De asemenea, prezentarea fcut are un puternic
caracter aplicativ, exemplele fiind noutatea fa de alte surse de documentare. [1]

2.3.3. Structuri condiionale i de ciclare


Ca orice alt limbaj de programare, PHP-ul dispune de o serie de faciliti
pentru controlul fluxului de desfurare al unui script. Astfel, limbajul beneficiaz de
aportul unor instruciuni prin care este permis o deviere de la ordinea fireasc de
derulare
a
fluxului
de
comenzi
ale
scriptului/programului
(numite
instruciuni/structuri de salt condiionat sau de ramificare, respectiv de ciclare).
Cteva astfel de structuri de control ale fluxului unui program sunt detaliate n
continuare la nivel de sintax, fiind nsoite fiecare de exemple de utilizare:
structura if-else, structura condiional switch, structurile while i do-while, bucla
for, respectiv comanda de ciclare foreach.
Una din cele mai folosite structuri de control condiionale este if-else, n PHP
avnd urmtoarea sintax simplificat:

2.3. Comenzi PHP

59

if ( conditie )
{
// secvena care se execut dac condiia este adevrat.
}
else
//ramificaie opional
{
// (Opional) secvena care se execut dac condiia este fals.

}
Structura if-else permite o bifurcare condiionat a programului. Iat un
exemplu (n care trebuie remarcat i operatorul de comparare egalitate ==):
if ( $name == "Ion" ) {
echo("Mesaj de afisat pentru: $name");
} else {
echo("Persoana neidentificat");
}
Exemplificarea anterioar utilizeaz o sintax redus a structurii condiionale
if-else (putnd s existe, de altfel, i o singur ramur condiional, evident if-ul).
De subliniat faptul ca parantezele acolade { } sunt obligatorii, chiar dac linia else
delimiteaz clar sfritul secvenei executate la ndeplinirea condiiei. O form
sintactic extins permite practic o ramificare nelimitat. Spre exemplificare, o
ramificare pe patru ramuri poate avea urmtorul cod:
if (conditie 1) {
...cod PHP
} elseif (conditie2) {
...cod PHP
} elseif conditie3) {
...cod PHP
}else (conditie 4) {
...cod PHP
}
Fiecare ramur elseif este testat doar dac condiiile impuse pe ramurile
anterioare nu sunt ndeplinite. ndeplinirea unei anumite condiii i execuia unei
anumite ramuri elseif (sau a ultimei ramuri else, ca ramur final opional)
conduce automat la ieirea din structura condiional. Altfel spus, verificarea
condiiilor se face secvenial, iar ndeplinirea uneia conduce automat la ieirea din
structur, verificarea tuturor ramurilor urmtoare fiind abandonat.
O alternativ des folosit pentru o multi-ramificaie bazat pe structura ifelseif-else o constituie structura condiional switch. Pentru o exemplificare concret
comparativ switch / if-elseif se consider urmtoarele secvene:
if ($var == 0) {
switch ($var) {
echo "mesaj 0";
case 0:
} elseif ($var == "ceva") {
echo "mesaj 0";
echo "ceva";
break;
} elseif ($var == 2) {
case "ceva":
echo "mesaj 2";
echo "ceva";
}
break;
case 2:
echo "mesaj 2";
break;
}

60

PHP - 2

Comanda break asigur ieirea automat din structur, celelalte ramuri ne


mai testndu-se. Lipsa break-ului ar conduce la o verificare i a condiiilor de pe
celelalte ramuri (care teoretic nu ar mai trebui ndeplinite, i deci nu i-ar mai avea
sens testarea lor). Exemplul prezentat anterior folosete o structur if-elseif (far
ramura opional else), evideniind i faptul c variabila testat poate avea fie valori
numerice, fie valori de tip string (diferena de abordare constnd n modul de
ncadrare sau nu cu ghilimele a coninutului verificat).
Dei nerecomandat, comanda de salt necondiionat goto, este disponibil i
ea n PHP (doar ncepnd cu versiune PHP 5.3 !). Exemplu:
goto eticheta;
echo Nu se va executa niciodata;
eticheta: echo Se executa permanent;
Trecnd la structurile de ciclare, poate cea mai des utilizat este bucla while
cu sintaxa clasic:
while (conditie) {
// secvena de comenzi executat
// repetat, ct timp condiia este adevrat
}
Aceast bucl permite executarea repetat a unei secvene de comenzi att
timp ct este ndeplinit o condiie (verificat aprioric execuiei corpului de comenzi)
. Un exemplu de afiare succesiv a numerelor de la 1 la 10, utiliznd o bucl while
are codul urmtor:
$count = 1;
while ($count <= 10) {
echo("$count");
// sau print ($count);
$count++; }
Oarecum echivalent cu while este structura do-while, deosebirea major
constnd n faptul c testarea condiiei se face ulterior execuie corpului de
instruciuni (i nu aprioric ca n cazul while):
do {
// secvena de comenzi executat repetat,
// (prima execuie fiind implicit) ct timp condiia este adevrat
}
while (conditie);
Nu putea lipsi din cadrul structurilor de ciclare clasica bucl for cu sintaxa
standard mprumutat de la limbajul C:
for (initializare_contor; conditie; actualizare_contor) {
// secvena de comenzi care se execut
// att timp ct condiia este adevrat
}
Un exemplu de implementare a unui numrtor printr-o bucl for:
for ($count = 1; $count <= 10; $count++) {
echo("$count");
}
i n final, foarte des utilizat n contextul operrii cu structuri de date de tip
array, comanda foreach permite crearea unei bucle pentru accesarea secvenial a
elementelor unui ir - array. Dac o structur de date array este convertit ntr-o
structur de tip object, foreach permite operarea i cu noua structur de date de tip
object. Sintaxa general foreach viznd tipul array este:
foreach (nume_array as $element)

2.3. Comenzi PHP

61

{
// secvena de comenzi executat repetat, procesnd variabila $element
}
Un exemplu concret de extragere i afiare a elementelor unui ir (array)
folosind foreach:
$sir = array(1, 2, 3, 4);
foreach ($sir as $element)
{
print $element.<br>;
// afiare elemente
}
Structurile repetitive implementate cu foreach sunt foarte des utilizate n
contextul operrii cu baze de date. Motivul l constituie faptul c, de regul, liniile
unei tabele sunt disponibile succesiv sub forma unui array, iar accesul la fiecare
element al acestuia se poate realiza cu o bucl foreach. Atenie ns, la fiecare nou
ciclu foreach, valoarea anterior extras este tears (suprascris). O alternativ la
acest impediment o constituie comanda list, permind extragerea ntr-o list de
variabile predefinite a elementelor unui ir (extragerea tuturor elementelor fcnduse simultan, nu succesiv).
Exemplu:
$sir = array(unu, doi, 3);
list($var1, $var2, $var3) = $sir;
echo $var1. .$var2. . $var3;
Dac numrul de variabile nu coincide cu numrul de elemente ale irului
array (indiferent c este mai mare sau mai mic), extragerea se va face doar pentru
elementele disponibile, fr semnalarea unui mesaj de avertisment sau de eroare.
Dezavantajul fa de foreach const n faptul c, dac se dorete extragerea ntr-un
set de variabile a ntregului coninut al irului, trebuie cunoscut aprioric numrul de
elemente ale acestuia.

2.4. Dezvoltare de aplicaii PHP cu baze de date MySQL


2.4.1. Funcii PHP pentru operare cu MySQL
Pe lng setul standard de comenzi aferente limbajului PHP, acesta dispune
de o serie de funcii i variabile predefinite care uureaz munca programatorului,
unele dintre ele fiind incluse implicit (built-in) n interpretor (spre exemplu, suportul
pentru MySQL, FTP, XML), altele fiind disponibile prin utilizarea unor fiiere externe
ca extensii (biblioteci .dll). Aceste fiiere extensie de tip .dll (cu numele generic
php_*.dll) permit limbajului PHP s opereze cu o mare diversitate de tehnologii
conexe, inclusiv cu baze de date (n acest ultim caz, ele nglobnd funciile necesare
accesrii i manipulrii unor baze de date de diverse tipuri).
MySQL este unul dintre cele mai folosite sisteme de gestiune a bazelor de
date client-server, fiind cel mai des utilizat n combinaie cu scripturi PHP. [11][20]
Operarea cu baze de date MySQL nu necesit utilizarea unei biblioteci suplimentare
(.dll), suportul pentru MySQL fiind inclus funcional n motorul interpretorului PHP.
Prezentul paragraf va prezenta cele mai importante funcii PHP utilizate n lucrul cu
bazele de date MySQL (tabel 2.1), nsoite de aplicaii exemplificative n paragrafele
ulterioare.

62

PHP - 2
Tabel 2.1.

Tip_returnat
Funcie(...)
resource mysql_connect

resource mysql_pconnect

bool mysql_close

bool mysql_select_db

bool mysql_create_db

Aciuni/caracteristici
- realizeaz conectarea la un server MySQL;
- funcia necesit trei parametri uzuali: nume
server MySQL/ adres IP server, nume utilizator
MySQL i parola de acces;
- returneaz valoarea logic FALSE n cazul n
care a euat conectarea la server-ul de baze de
date, respectiv un identificator resurs de acces la
conexiunea cu server-ul MySQL n cazul n care
conectarea a reuit.
- realizeaz o conexiune permanent la un server
MySQL (parametrii fiind aceiai ca la funcia
anterior);
- iniial, caut o conexiune permanent deja
existent, iar n cazul n care nu gsete, creeaz
una;
- nu nchide conexiunea la final de script;
- returneaz valoarea logic FALSE n cazul n
care a euat conectarea la server, respectiv un
identificator resurs de acces la conexiunea cu
MySQL n cazul n care conectarea a reuit.
- primete ca parametru un identificator de acces
la o conexiune cu un server MySQL i realizeaz
nchiderea acesteia. n cazul n care parametrul
nu este specificat, se va nchide conexiunea
curent;
- returneaz valoarea logic TRUE n cazul n care
nchiderea conexiunii s-a realizat cu succes,
respectiv valoarea logica FALSE n caz contrar;
- funcia este opional n cazul n care
conexiunea
nu este permanent, aceasta
nchizndu-se automat la final de script.
- selecteaz/deschide o baza de date curent
(existnd deja o conexiune cu un server MySQL)
pentru interogrile/operaiile SQL care vor urma;
- funcia are doi parametri: primul este de tip ir
de caractere, reprezentnd numele bazei de date
deschise/selectate, iar cel de-al doilea parametru
reprezint identificatorul resurs de acces la
conexiunea cu serverul MySQL;
- returneaz valoarea logic TRUE n cazul n care
s-a reuit selectarea bazei de date, respectiv
valoarea logic FALSE n cazul n care baza de
date nu poate fi deschis (nu exist, utilizatorul
nu are drepturi de acces la aceasta, etc).
- permite crearea unei noi baza de date MySQL;
- funcia are doi parametri: primul este de tip ir
de caractere, reprezentnd numele bazei de date
care va fi creat, iar cel de-al doilea parametru

2.4. Dezvoltare de aplicaii PHP cu baze de date MySQL

bool mysql_drop_db

63

reprezint identificatorul aferent conexiunii cu


MySQL-ul;
- returneaz valoarea logic TRUE n cazul n care
a reuit s creeze baza de date, respectiv
valoarea logic FALSE n caz contrar.
- permite tergerea unei baze de date MySQL;
- funcia are doi parametri: primul este de tip ir
de caractere, reprezentnd numele bazei de date
care va fi tears, iar cel de-al doilea parametru
reprezint identificatorul aferent conexiunii cu
MySQL-ul;
- returneaz valoarea logic TRUE n cazul n care
a reuit s tearg baza de date, respectiv
valoarea logic FALSE n caz contrar.

resource mysql_query

- trimite/paseaz o comand SQL spre serverului


MySQL (sub forma unui string de caractere);
- returneaz, n caz de succes, un identificator
resurs care va fi folosit n continuare ca
parametru n apelurile unor eventuale funcii,
(realiznd extragerea rezultatului interogrii), iar
n caz contrar, returneaz valoarea logic FALSE.

array mysql_fetch_row

- returneaz o nregistrare/linie extras dintr-o


tabel interogat (sau jonciune de tabele), sub
forma unui ir (array cu primul indice de element
0).
- presupunnd $row numele array-ului returnat,
elementele acestuia pot fi referite pa baza
indicelui lor: $row[0], $row[1], ...

array mysql_fetch_assoc

- aceeai funcionalitate ca i mysql_fetch_row,


dar elementele irului returnat sunt referite nu
prin indici, ci prin nume asociate lor, identice cu
numele coloanelor referite prin interogare:
$row[coloana1], $row[coloana2], ...

array mysql_fetch_array

- aceeai funcionalitate ca i mysql_fetch_row


/mysql_fetch_assoc, n varianta implicit (fr
parametri opionali), permind ambele moduri
de referire a elementele irului returnat: fie prin
indice, fie prin numele asociat (numele coloanei).
- deci se poate face o referire echivalent a unui
element: $row[0] sau $row[coloana1]

object mysql_fetch_object

- aceeai funcionalitate ca i mysql_fetch_row,


returnnd ns un tip object, datele putnd fi
referite ca proprieti ale acestuia:
$row->coloana1,
$row->coloana2, ...

64

PHP - 2

int mysql_num_rows
int mysql_num_fields
resource mysql_list_fields

string mysql_field_name
int mysql_field_len
string mysql_field_type

- returneaz numrul de linii obinute n urma


executrii unei comenzi SQL de interogare
SELECT.
- returneaz numrul de coloane (cmpuri)
aferente setului de date obinut ca urmare a
execuiei unei comenzi SQL SELECT.
- permite oferirea de informaii asupra unei
anumite tabele (jonciuni de tabele), returnnd ca
rezultat un identificator resurs, care poate fi
folosit de ctre urmtoarele funcii conexe:
mysql_field_name,
mysql_field_len,
mysql_field_type.
- returneaz succesiv numele coloanelor tabelei.
- returneaz succesiv dimensiunea coloanelor
tabelei.
- returneaz succesiv tipul coloanelor tabelei.

int mysql_affected_rows

- returneaz numrul de linii afectate de o


comand SQL anterioar de tip UPDATE, INSERT,
DELETE.

int mysql_errno

- permite identificarea erorii care s-a produs n


timpul execuiei de ctre serverul MySQL a unei
comenzi SQL;
- returneaz codul numeric al erorii n
cazul n care a aprut o eroare n timpul
executrii unei comenzii SQL, respectiv 0 n caz
contrar.
- permite identificarea erorii care s-a produs n
timpul executrii unei comenzi SQL;
- returneaz un mesaj n care eroarea este
descris explicit n cazul n care a aprut o eroare
n timpul executrii unei comenzii SQL, respectiv
un ir vid n caz contrar.

string mysql_error

tip_variabil mysql_result

bool mysql_free_result

- preia valoarea unei celule din setul de date,


aferente unei anumite coloane dintr-un rnd al
unui cursor, rezultat ca urmare a unei comenzi
SQL SELECT.

- realizeaz eliberarea zonei de memorie ocupat


de cursorul indicat ca argument, rezultat ca
urmare a unei comenzi SQL SELECT;
- returneaz valoarea logic TRUE n caz de
succes, respectiv valoarea logic FALSE n caz
contrar.
Observaie: De regul, cele mai utilizate funcii PHP pentru operarea cu o baz de
date MySQL sunt: mysql_connect (conectare la serverul MySQL), mysql_select_db
(deschiderea unei baze de date), mysql_query (interogare prin trimiterea spre
server a unui string ntr-o sintax valid de comand SQL), mysql_fetch_row
(extragere date returnate), mysql_close (nchidere conexiune). Se poate remarca o

2.4. Dezvoltare de aplicaii PHP cu baze de date MySQL

65

mare varietate de comenzi destinate extragerii datelor returnate de o interogare


(mysql_fetch_...), rmnnd la latitudinea programatorului selecia comenzii pe
care o consider cea mai potrivit.
Folosind funciile anterior prezentate (i nu numai acestea), programatorul
poate realiza aplicaii PHP complexe n conexiune cu baze de date de tip MySQL,
conferind astfel o dinamic sporit aplicaiei WEB.

2.4.2. Elemente MySQL


Dup instalarea pachetului WAMP, un client consol MySQL este disponibil
chiar din meniul WAMP, sub denumirea MySQL Console (fig. 2.2). [21] User-ul cu rol
de administrator al serverului MySQL are numele root i nu are o parol implicit
setat. [11] Este indicat ca, dup prima logare, s se seteze o parol pentru acest
important user.

Fig. 2.2. WAMP- MySQL Console

Setarea unei parole pentu user-ul root se poate face cu o comand de genul:
mysql> SET PASSWORD FOR root@localhost = PASSWORD(parola);
mysql> SET PASSWORD FOR root@% = PASSWORD(parola);
De sunt necesare dou comenzi? Practic sunt doi useri administrator, cu
acelai nume root, unul fiind dedicat conectrii exclusiv de pe localhost, iar cellalt
(cu acelai nume) pentru realizarea unor conexiuni din exterior (la distan sau
remote).
Cei doi useri pot fi vizualizai cu comanda (parolele fiind criptate):
mysql> select host, user, password from mysql.user;
Tot dupa instalarea serverului de baze de date, dou baze sunt implicit
create, avnd numele mysql (coninnd informaiile pentru administrarea userilor,
drepturilor acestora, parolelor de acces, etc.), respectiv test (baz de lucru pentru
root).
Vizualizarea numelor bazelor de date existente pe server, respectiv
deschiderea uneia sau alteia i afiarea numelor tabelelor din baza curent, se poate
face cu o secven de comenzi de forma urmtoare:

66

PHP - 2

mysql> SHOW DATABASE;


mysql> USE test;
mysql> SHOW TABLES;
Pentru proiectarea i
implementarea unei noi aplicaii, se recomand
crearea unei noi baze de date, respectiv crearea unui nou user i atribuirea de
drepturi acestuia doar pe aceast nou baz de date. Spre exemplu:
mysql> CREATE DATABASE persoane;
mysql> CREATE USER ion@localhost IDENTIFIED BY parola;
mysql> GRANT ALL ON persoane.* TO ion@localhost;
Se presupune serverul MySQL plasat pe acelai host cu interpretorul PHP, cu
serverul Apache i deci, implicit, cu scripturile PHP care integreaz rolul de user).
Astfel, un singur user MySQL permind doar o conectare de pe localhost este
suficient pentru operare (oferind n plus i o securitate suplimentar, doar un apel
conexiune dintr-un script PHP fiind permis, respectiv orice apel extern, de la
distan (remote), fiind respins). Folosirea noului user implic deschiderea unei noi
console client, aceasta putnd fi startat printr-o comand de rulare direct a
aplicaiei client mysql.exe cu parametri (-h urmat de numele/adrea IP a host-ului, -u
urmat de numele de user, p preciznd c este necesar i se va cere o parol):
C:\wamp\mysql\bin\mysql.exe -h localhost -u ion -p
Dup tastarea parolei adecvate, prompter-ul mysql> va apare confirmnd
realizarea conexiunii la server i permind deschiderea bazei dorite:
mysql> USE persoane;
n acest moment se poate trece la crearea tabelelor bazei de date i la o
operare standard cu comenzi SQL consacrate (CREATE TABLE, INSERT, UPDATE,
DELETE, SELECT, etc.).
Tabela table1, considerat n continuare n majoritatea exemplificrilor care
vor urma (aparinnd bazei de date persoane), a fost creat folosind comanda:
CREATE TABLE table1(
Nume
CHAR(10),
Varsta
INTEGER,
localitate
CHAR(10));
Observaii: Prsirea consolei MySQL (i implicit nchiderea conexiunii user-ului
curent cu serverul) se face cu comanda exit. Din motive de comoditate viznd
lansarea rapid a unui ferestre consol MySQL (permind implicit conectarea doar
ca user administrator), exemplele care urmeaz folosesc userul root pentru accesul
la baza de date persoane.

2.4.3. Interogare neparametrizat a unei tabele a bazei de date


Acest prim exemplu prezint o modalitate simpl de interogare fr
parametrii a unei tabele a unei baze de date MySQL. Sunt exemplificate modurile de
utilizare ale urmtoarelor funcii, respectiv comenzi i structuri:
funcii legate direct de lucrul cu baze de date MySQL: mysql_connect(),
mysql_select_db(), mysql_query(), mysql_num_rows(), mysql_num_fields(),
mysql_fetch_row( );
funcii i comenzi PHP generale: print( ),echo, if( ), while( ), foreach( ), die( ).
Exemplul este pur didactic, aplicaia nefiind optimizat, rolul ei fiind doar
acela de a detalia funcionalitile unor comenzi, funcii i structuri PHP uzual
folosite n operarea cu baze de date, controlul fluxul scriptului i a modului de
proiectare i implementare al unui acces la date stocate pe un server MySQL.

2.4. Dezvoltare de aplicaii PHP cu baze de date MySQL

67

Cunotine apriorice legate de bazele de date SQL sunt necesare, n continuare sunt
punctate pe scurt cteva aspecte specifice MySQL-ului.
Codul surs PHP al aplicaiei considerate este urmtorul (rezultatul apelului
acesteia, folosind un browser WEB, fiind prezentat n fig. 2.3) :
<?php
//Conectare la server
//(n cazul de fa, server MySQL local, user root, parola parola)
mysql_connect("localhost","root","parola") or die ("Nu se poate conecta la serverul
MySQL");
//Selecie baza de date
mysql_select_db("persoane") or die("Nu se poate deschide baza de date");
//Interogare tabel (comand SQL)
$query=mysql_query("select * from table1 where nume=ion");
//Creeaz capul de tabel (se face o afiare tabelat)
print(<table align=center BORDER="2">);
print ("<tr>");
echo <th BGCOLOR="Silver">Nume</th>;
echo <th BGCOLOR="Silver">Virsta</th>;
echo <th BGCOLOR="Silver">Localitate</th>;
print ("</tr>");
//Iniializare variabil_contor coninnd numrul de elemente (celule)
// returnate prin interogarea tabelei
$nr_val=0;
//Cicleaz dup nr. nregistrri/linii gsite (realiznd o condiie logic i o
// atribuire prin returnarea elementelor unei linii/nregistrri n variabila
// ir (array) $row)
while ($row = mysql_fetch_row($query)){
// Variabila $row este un ir (array) coninnd succesiv, la un moment
// dat, elementele unei nregistrri (row[0] va conine elemente din
//coloana 1 a liniei curente, etc)
//Creeaz o linie nou n tabel
echo" <tr>\n";
//Cicleaz dup elementele unei nregistrri/linii
foreach ($row as $value) {
//Pune ntr-o celul din tabel elementul unei nregistrri (valoarea dintr// un cmp al nregistrrii)
//Creeaz o coloan nou n linia tabelului
echo "<td>$value</td>";
//Incrementeaz variabila_contor =
// nr.total elemente = nr.inreg. X nr. cmpuri
$nr_val++;
}//nchide bucl foreach
echo "</tr>";
}//nchide bucl while
//Calculeaz nr. de coloane returnate prin interogare
$coln=mysql_num_fields($query);
$nr_inreg=$nr_val/$coln;
//calculeaz nr. de nregistrri/linii

68

PHP - 2

echo "<br>";
echo "<center>";
if ($nr_inreg>0)
//verific cte nregistrri s-au gsit
echo "s-au gasit: ".$nr_inreg." inregistrari";
// punctul (.) - rol de operator de concatenare ntre siruri
else
die ("Nu gasesc nici o inregistrare ...");
//Comanda die nchide programul i toate conexiunile (ieire forat)
echo "</center>";
//Comanda urmtoare se va executa numai n caz de cutare reuit
mysql_close();
?>

Fig. 2.3. Afiare date interogare


Funcia mysql_connect realizeaz conectarea la serverul MySQL. Aceast
funcie poate avea pn la cinci parametri (toi putnd fi opionali), dintre care doar
primi trei sunt de regul necesari, ultimii doi fiind mai puin folosii:
- Primul parametru reprezint numele server-ului MySQL sau adresa de IP a
computerului pe care rezid serverul. Dac acest parametrul lipsete, caz n care i
ceilali patru lipsesc (mysql_connect()), se ncearc conectarea la un eventual
server MySQL de pe calculatorul curent (conectare pe local, echivalent de altfel cu
a scrie ca nume de server localhost -ca n exemplul anterior- sau adresa IP
127.0.0.1). n acest caz, ca nume de utilizator implicit se va considera root, fr
parol (user-ul implicit MySQL).
- Cel de-al doilea parametru reprezint numele utilizatorului, iar n cazul n
care lipsete (obligatoriu lipsind i ceilali parametrii care l succed), se folosete ca
substitut implicit numele de utilizator sub care ruleaz serverul MYSQL, adic de
regul root (mysql_connect("localhost"));
- Al treilea parametru reprezint parola utilizatorului, iar n caz ca lipsete se
folosete irul vid pe post de parol pentru conectarea la server
(mysql_connect("localhost","user1"));
Observaie: Din motive de securitate, se recomand a se folosi aceti primi trei
parametrii cu valori concrete, ne lsndu-se (prin lips lor) active valorile implicite
care conduc la o cretere substanial a gradului de vulnerabilitate al aplicaiei.

2.4. Dezvoltare de aplicaii PHP cu baze de date MySQL

69

Pentru MySQL (inclus n pachetul WAMP5), dup cum s-a mai precizat, user-ul
implicit existent la instalare este root, fr parol.
- Al patrulea parametru este de tip logic, avnd rolul de a indica motorului
PHP c, n cazul n care exist deja o conexiune la acelai server MySQL, s creeze o
nou conexiune n loc s o reutilizeze pe cea existent;
- Ultimul parametru este de tip ntreg i reprezint proprietile pe care le va
avea conexiunea (spre exemplu, dac se folosete compresia datelor).
Funcia mysql_connect returneaz (n cazul n care conectarea a reuit) un
identificator resurs de acces aferent conexiunii cu server-ul MySQL. Funcia este
absolut necesar a fi folosit naintea oricrei alte funcii opernd cu MySQL,
asigurnd practic realizarea conexiunii/legturii cu serverul de baze de date.
Funcia mysql_select_db selectez/deschide o baz de date aferent
serverului MySQL cu care s-a fcut conexiunea, fiind absolut necesar pentru
interogrile/comenzile SQL care vor urma. Funcia are doi parametri: primul
(obligatoriu), este de tip ir de caractere i reprezint numele bazei de date pe care
se va opera, iar cel de-al doilea parametru (opional) reprezint identificatorul de
acces la conexiunea cu serverul MySQL. Dac acesta nu este specificat explicit, se
consider conexiunea curent existent cu serverul MySQL. Funcia returneaz
valoarea logic TRUE n cazul n care s-a reuit selectarea bazei de date, respectiv
valoarea logica FALSE n caz contrar (baz de date nu exist, utilizatorul nu are
drepturi de acces la aceasta etc.).
Funcia mysql_query este cea prin care se asigur interaciunea efectiv cu
elementele (datele) bazei de date, permind operaiile SQL uzuale (interogare,
adugare, tergere, modificare etc). Funcia are doi parametri:
- Primul parametru este de tip ir de caractere i reprezint cererea
(comanda SQL) trimis spre execuie server-ului MySQL (n exemplul de fa, o
comand SELECT pe o tabel);
- Al doilea parametru reprezint identificatorul de acces al conexiuni cu
serverul MySQL. n cazul n care acesta lipsete se ia n considerare conexiunea
curent;
n exemplul anterior, cutarea n tabel s-a fcut dup o valoare bine
precizat: "select * from table1 where nume=ion". Exist ns situaii n care nu
se cunoate exact valoarea cheii de cutare, n acest caz, o alternativ constituind-o
folosirea operatorul like. Acesta, mpreun cu wildcard-ul % permit realizarea
unei interogri dup o masc aproximativ (ceva ce seamn cu cheia de cutare).
Spre exemplu, dac se dorete afiarea tuturor persoanelor a cror nume ncepe cu
ion, se poate folosi comanda "select * from table1 where nume like ion%". n
cazul n care se cere afiarea tuturor persoanelor a cror vrst se termin cu cifra
9, comanda select va arta n felul urmtor: "select * from table1 where varsta like
%9"
Observaie: Evident, comanda SELECT poate fi i o interogare pe mai multe tabele
(jonciuni de tabele), spre exemplu: select tabela1.col11, tabela1.col.12,
tabela2.col21, tabela2.col22 from tabela1, tabela2 where tabela1.col.12 =
tabela2.col21
Bucla
while($row=mysql_fetch_row($query)),
utiliznd
funcia
mysql_fetch_row, poate fi interpretat astfel: att timp ct este gsit o linie
(coninutul fiecrei linii gsite fiind returnat succesiv de funcia mysql_fetch_row
n variabila array $row) execut.
Funcia mysql_fetch_row va umple succesiv un ir ($row) cu datele unei
linii returnate de interogare. Aceste date sunt prelucrate succesiv (de regul afiate
ntr-un tabel pe ecran), ncepnd cu prima linie, apoi se trece la a doua (coninutul

70

PHP - 2

irului $row fiind astfel suprascris succesiv) i aa mai departe. Practic, bucla while()
cicleaz dup numrul de articole/linii gsite i returnate n urma interogrii.
Dup cum s-a mai precizat, PHP-ul ofer o multitudine de funcii alternative
pentru extragerea datelor aferente liniilor returnate de interogare. n exemplificarea
curent s-a folosit mysql_fetch_row, dar se puteau folosi (n cadrul condiiei
buclei while) i urmtoarele variante alternative:
$row = mysql_fetch_array($query), cele 3 elemente ale arrayului $row putnd fi referite direct $row[0], $row[1], $row[2], ceea ce ar
conduce probabil la un cod mai optimizat.
$row = mysql_fetch_assoc($query), genernd un ir cu
elementele $row[nume], $row[varsta], $row[localitate], referite cu nume
asociate coloanelor interogrii (n cazul de fa, chiar numele coloanelor tabelei).
$row = mysql_fetch_object($query), elementele irului returnat
putnd fi referite ca: $row->nume, $row->varsta, $row->localitate.
Dac numrul de linii returnate de interogare este constant, cunoscut
aprioric, funcia de extragere a datelor mysql_fetch_row poate fi referit explicit
de cte ori este nevoie, fr a se mai face apel la o structur de ciclare, gen while.
Este cazul unei cutri dup o cheie primar, numrul de linii gsite putnd fi 1 sau
0. n acest caz, comanda de extragere trebuie referit o singur dat, returnnd fie
un array aferent linie gsite, fie FALSE dac nu a gsit nici o linie.
Linia print(<table align=center BORDER="2">); trimite spre ecran un
ir HTML pentru crearea unui tabel n care vor fi afiate datele gsite. Deci tag-ul
<table> definete un tabel de afiare, tag-ul <tr> se refer la construcia unei linii
din tabel, <th> la o linie-header (cap de tabel), <td> la o coloan, toate fiind
elemente HTML care permit construcia unui format tabelat de afiare pe ecran.
Observaie: Comanda print are un efect similar cu al comenzii echo (afiare
neformatat a unui string). Pentru afiarea unor string-uri care includ variabile, se
poate folosi i o comanda de afiare formatat printf (dispunnd de civa
parametri speciali pentru formatarea coninutului variabilelor integrate n string-ul
de afiat: %s, %d, %f). Un scurt exemplu de utilizare al acesteia este prezentat n
continuare:
$var="string";
printf("Afisare: %s\n", $var);
//Afiare: string
$var=10.1234;
printf("Afisare intreg: %d", $var);
//Afiare intreg: 10
printf("Afisare float: %f", $var);
//Afisare float: 10.123400
printf(Afisare float: %.2f , $var);
//Afisare float: 10.12
Comanda foreach ($row as $value) este practic o bucl intern buclei
while(), ciclnd n cadrul fiecrui articol/linie dup numrul de elemente ale
articolului/liniei. Pentru fiecare articol succesiv gsit (in ciclul while()), comanda
foreach() ca i bucl, extrage succesiv din irul $row cte un element i-l trimite
spre variabila $value (care la un moment dat conine o valoare a unui articol
corespunztoare unui anumit cmp, deci practic valoarea unei celule).
Afiarea pe ecran (n celulele tabelului de afiare construit) a coninutului
variabilei $value (echo "<td >$value</td>";), nseamn practic afiarea element
cu element a coninutului fiecrui articol gsit, n celule succesiv create. Prin
incrementarea variabile $nr_val, aceasta va conine numrul total de elemente (spre
exemplu dac numrul de articole gsite este 3 (bucla while() se va executa de 3

2.4. Dezvoltare de aplicaii PHP cu baze de date MySQL

71

ori), iar numrul de cmpuri este 5 (bucla foreach() se va executa de 5 ori),


$nr_val=3X5=15.
Funcia mysql_num_fields returneaz numrul de coloane (cmpuri)
rezultat n urma interogrii cu comanda mysql_query. Dac mysql_query conine o
comand SQL de forma SELECT * , practic va returna numrul total de coloane
(cmpuri) ale tabelei (sau jonciunii de tabele) referite. mprind valoarea variabilei
$nr_val la valoarea returnat de funcia mysql_num_fields (oferind numrul de
cmpuri implicate n interogare), se obine numrul de nregistrri/linii gsite i
returnate de interogare.
Comanda die (executat pe ramura else a verificrii if( )) nchide automat
conexiunea i ncheie forat programul (nici o alt comand care ar mai urma n
script nu se mai execut) .
Comanda mysql_close nchide conexiunea cu serverul MySQL (primind ca
parametru un identificator de acces la o conexiune spre un server MySQL). n cazul
n care parametrul nu este specificat, se nchide conexiunea curent. n exemplul de
fa, aceast comand se execut doar dac comanda die() de pe latura else nu sa executat n prealabil.
O variant alternativ de codare PHP a funcionalitilor aceleiai aplicaii,
este prezentat n continuare:
<?php
mysql_connect("localhost","root","parola") or die ("Nu se poate conecta la serverul
MySQL");
mysql_select_db("persoane") or die("Nu se poate selecta baza de date");
$query=mysql_query("select * from table1 where nume=ion");
//Calculeaz DIRECT ntr-o variabil nr. de linii returnate prin interogare
//$nr_inreg=@mysql_num_rows($query);
if ($nr_inreg>0){
echo "<center>";
echo "S-au gasit " . $nr_inreg . " inregistrari";
echo"</center>";
echo"<table border=2 align=center>";
echo"<tr bgcolor=silver>";
echo"<th>Nume</th>";
echo"<th>Varsta</th>";
echo"<th>Localitate</th>";
echo"</tr>";
while($row=mysql_fetch_row($query)){
echo"<tr>";
foreach ($row as $value){
echo "<td>$value</td>";
}
echo"</tr>";
}
echo"</table>";
}
else{
echo"<center>";
echo "Nu s-a gasit nici o inregistrare!!!";

72

PHP - 2

echo"</center>";
}
mysql_close();
?>
Aceasta variant reprezint o optimizare din punct de vedere al operrii pe
partea de interpretor PHP (practic pseudo-clientul aplicaiei Web), ntruct pentru a
calcula numrul de nregistrri obinute n urma interogrii se folosete funcia
mysql_num_rows, pasndu-se aceast sarcin serverului MySQL (care primete
astfel o solicitare n plus). Aceasta funcie returneaz numrul de linii obinute n
urma executrii unei comenzi SQL SELECT. Semnul @ (care apare n faa funciei
mysql_num_rows) are rolul de a suprima afiarea pe ecran a unor eventuale
warning-urilor (mesaje de avertisment) care pot aprea n timpul execuiei unor
comenzi.
n cele dou versiuni ale aplicaiei anterior prezentate, capul de tabel pentru
afiarea informaiilor din tabela bazei de date s-a realizat n mod manual,
presupunndu-se cunoscute numele coloanelor i numrul lor.
PHP-ul dispune de funcii prin care se pot obine informaii asupra structurii unei
tabele, informaii care pot fi utilizate pentru realizarea automat a unui cap de
tabel pentru afiare (coloanele lui fiind practic cmpuri ale tabelei bazei de date).
n continuare, sunt enumerate cteva dintre aceste funcii:
-mysql_list_fields() ofer informaii asupra structurii unei anumite tabele,
returnnd ca rezultat un identificator, care poate fi folosit de ctre urmtoarele
funcii, cu semnificaiile aferent precizate :
-mysql_field_name()- returneaz succesiv numele coloanelor tabelei;
-mysql_field_len() - returneaz succesiv lungimea coloanelor tabelei;
-mysql_field_type()- returneaz succesiv tipul coloanelor tabelei;
-mysql_num_fields() - returneaz numrul coloanelor tabelei.
Urmtorul exemplu comentat este destul de edificator asupra modului de
utilizare a acestor funcii, fr a mai fi necesar o prezentare a sintaxei lor de baz:
<?php
//Conectare la serverul MySQL
$link = mysql_connect(localhost, root, parola);
// Informaii asupra structurii unei anumite tabele dintr-o baz de date
$fields = mysql_list_fields("persoane", "table1",$link);
// Numrare coloane ale tabelei referite
$columns = mysql_num_fields($fields);
// Pentru fiecare coloan, afieaz numele, tipul i lungimea ei pe rnd nou
for ($i = 0; $i < $columns; $i++){
echo mysql_field_name($fields, $i);
echo mysql_field_type($fields, $i);
echo mysql_field_len($fields, $i);
echo <br>;
}
?>
Efectul rulrii scriptului anterior const n afiarea, pe coloan, a numelui,
tipului i lungimii fiecrui cmp al unei anumite tabele a unei baze de date MySQL,
tabel referit printr-un identificator ($fields) n funciile specializate folosite.
Observaie: Fiecare din funciile returnnd numele, tipul i lungimea unei coloane a
tabelei are ca argumente un identificator de pointare la tabel ($fields), respectiv un

2.4. Dezvoltare de aplicaii PHP cu baze de date MySQL

73

index de coloan (pornind de la zero) reprezentnd poziia coloanei referite (aa


cum se poate observa i n scriptul anterior prezentat).
O numrare a liniilor tabelei care ndeplinesc o anumit condiie impus, se
poate face i folosind funcia SQL COUNT:
$nr=mysql_query("select COUNT(*)from table1 where nume=ion");
$row = mysql_fetch_row($query);
echo $row[0];
sau
$query=mysql_query("select COUNT(*) as numar from table1 where nume=ion");
$row = mysql_fetch_array($query);
echo $row[numar];
De remarcat faptul c, dei interogarea returneaz o singur valoare (un
scalar), funcia de extragere (fetch) returneaz tot un ir, este adevrat cu un
singur element, iar referirea lui se va face n mod adecvat referirii unui element de
ir.
Rezumnd, principalele funcii folosite pentru lucrul cu baze de date MySQL
sunt urmtoarele:
mysql_connect - permite conectarea la un server MySQL;
mysql_select_db - permite selecia bazei de date MySQL;
mysql_query - execut o comand SQL;
mysql_fetch_row - returneaz o linie din tabel ca ir;
mysql_num_fields - returneaz numrul de coloane(cmpuri)
dintr-un set de rezultate creat ca urmare a unei comenzi SQL SELECT;
mysql_num_rows - returneaz numrul de linii obinute n urma
executrii unei comenzi SQL SELECT;
mysql_list_fields - ofer informaii asupra unei anumite tabele,
returnnd ca rezultat un identificator, care poate fi folosit de ctre urmtoarele
funcii: mysql_field_name, mysql_field_len, mysql_field_type;
mysql_field_name - returneaz succesiv numele cmpurilor
tabelei;
mysql_field_type - returneaz succesiv tipul cmpurilor tabelei;
mysql_field_len returneaz succesiv lungimea cmpurilor
tabelei;
mysql_close - nchide o conexiune cu baza de date,

2.4.4. Interogare parametrizat a unei tabele a bazei de date


Realizarea unei interogri a unei tabele aferente unei baze de date, implic
obligatoriu transmiterea unor parametrii dup care se face cutarea. Exemplul
anterior de interogare, fr parametrii, este pur didactic (doar pentru exemplificarea
modului de utilizare a funciilor PHP de operare cu o baz de date). n realitate,
orice interogare pe Web necesit anumii parametri de intrare.
a) Interogare cu cutare exact (cu toi parametrii obligatoriu de introdus)
Acest prim exemplu presupune o interogare a unei tabele a bazei de date,
cu afiarea liniilor gsite, filtrarea fcndu-se funcie de valorile introduse pentru un
nume i o varsta (cmpuri ale tabelei), ambele furnizate obligatoriu (ca parametrii
de intrare i implicit de interogare).
Un prim fiier script HTML necesar (fig.2.4), realizeaz doar o preluare a
acestor parametrii (de la tastatur) i o "pasare" a lor (printr-un form nsoit de o

74

PHP - 2

aciune "POST") spre pagina propriu-zis de interogare (scriptul PHP), plasat la


adresa local http://localhost/ex2.php:
<html>
<title>Interogare cu parametrii</title>
<center>
<head><H1>Interogare cu parametrii</H1></head>
</center>
<form method="POST" action="http://localhost/ex2.php">
<table border=10 align=center BGCOLOR="Silver">
<td>
Nume:<input type="text" name="nume" size="10"><br>
Varsta:<input type="text" name="varsta" size="4"><br>
<input type="SUBMIT" value="Cauta" >
<input type="RESET" value="Reset" >
</td>
</table>
</form> </html>
Elementul esenial al fiierului HTML anterior, este obiectul HTML <form
action=POST , avnd rolul de preluare de la tastatur a unor valori pentru cei doi
parametrii (nume i varsta simpl coinciden faptul c numele lor este acelai cu
al unor cmpuri ale tabelei bazei de date) i pasarea lor spre scriptul PHP localizat
de linia:
action="http://localhost/ex2.php"
ntreg coninutul formularului <form > </form> a fost plasat n celula
unei tabele (avnd culoarea de background argintiu), fr a fi obligatorie aceast
afiare tabelat (mai reuit ns din punct de vedere al designului):
<table border=10 align=center BGCOLOR="Silver">
<td>
.
.
.
</td>
</table>
Totui, nucleul esenialul a acestui fiier HTML este urmtorul (putndu-se
reduce doar la secvena urmtoare):
<form method="POST" action="http://localhost/ex2.php">
Nume:<input type="text" name="nume" size="10" ><br>
Varsta:<input type="text" name="varsta" size="4" ><br>
<input type="SUBMIT" value="Cauta" >
<input type="RESET" value="Reset" >
</form>
Se pot remarca:
- cele dou tag-uri <input type="text" care creeaz dou casete pentru preluarea
datelor (fig.2.4) n cele dou variabile-parametru, nume i varsta;
- tag-ul <input type="SUBMIT" care genereaz un buton, la apsarea cruia
valorile celor doi parametrii sunt trimise ctre fiierul PHP localizat prin adresa:
action="http://localhost/ex2.php";
- tag-ul <input type="RESET" care reseteaz valorile parametrilor i anuleaz
transmiterea lor;
Observaie: Referirea ntr-un script a unei alte pagini WEB (HTML PHP, etc.) se
poate face, fie prin adresare direct (caz n care se precizeaz inclusiv calea

2.4. Dezvoltare de aplicaii PHP cu baze de date MySQL

75

complet spre acea pagin, spre exemplu "http://localhost/ex2.php"), fie prin


adresare relativ (fr a mai fi necesar calea complet spre pagina referit). n
acest ultim caz, dac scriptul apelant i scriptul apelat/referit sunt n acelai
director/locaie, ajunge precizarea doar a numelui paginii apelate ("ex2.php").

Fig. 2.4. Ecran interogare

Codul PHP al fiierul realiznd conectarea la baza de date i interogarea


tabelei table1 a bazei de date MySQL persoane este urmtorul (acest fiier primete
de la scriptul HTML anterior prezentat, valorile parametrilor nume=valoare_tastata1,
respectiv varsta= valoare_tastata2):
<?php
mysql_connect("localhost","root","parola") or die ("Nu se poate conecta la serverul
MySQL");
mysql_select_db("persoane") or die("Nu se poate selecta baza de date");
echo"<br><br>";
//Preluarea cu metoda POST a parametrilor transmii de ctre fiierul
//HTML spre scriptul PHP (parametrul register_globals=ON n php.ini)
$nume=$_POST[nume];
$varsta=$_POST[varsta];
// Interogare cu parametri
$query=mysql_query("select * from table1 where nume=$nume and
varsta=$varsta");
//Calculeaza nr. de nregistrri returnate prin interogare
$nr_inreg=@mysql_num_rows($query);
if ($nr_inreg>0){
echo "<center>";
echo "S-au gasit " . $nr_inreg . " inregistrari";
echo"</center>";
//creeaz capul de tabel
echo "<table border=2 align=center>";
echo"<tr bgcolor=silver>";
echo"<th>Nume</th>";
echo"<th>Varsta</th>";
echo"<th>Localitate</th>";
echo"</tr>";

76

PHP - 2

// Afieaz nregistrrile gsite n urma interogrii


// (se putea folosi i mysql_fetch_array sau mysql_fetch_assoc
// cu referiri ale elementelor de genul $row[0]sau $row[nume] etc.)
while($row=mysql_fetch_row($query)){
echo"<tr>";
foreach ($row as $value){
echo "<td>$value</td>";
}
echo"</tr>";
}
echo"</table>";
}
else{
echo"<center>";
echo "Nu s-a gasit nici o inregistrare!!!";
echo"</center>"; }
// nchide conexiunea cu serverul MySQL
mysql_close();
?>
Rezultatul apelului acestui script cu parametri, i implicit al interogrii, este
prezentat n fig.2.5.

Fig. 2.5. Rezultatul interogrii exacte parametrizate

Fa de exemplele prezentate n paragraful anterior, singura deosebire


major apare n linia:
$query=mysql_query("select * from table1 where nume=$nume and
varsta=$varsta");
reprezentnd o interogare parametrizat. (variabilele $nume i $varsta,
reprezentand valorile preluate de la tastatur i transmise de fiierul HTML spre
fiierul PHP apelat).
b) Parolarea accesului
n scriptul anterior, accesul la serverul MySQL se face prin precizarea
explicit a parolei direct n cod. n unele situaii, din motive de restricionare a
accesului, acest lucru nu este ns de dorit. Parolarea accesului, n exemplul de fa,
se poate face prin transmiterea parolei ca un parametru de intrare, introdus de la
tastatur odat cu ceilali parametrii (afereni interogrii - fig. 2.6).

2.4. Dezvoltare de aplicaii PHP cu baze de date MySQL

77

Fig.2.6. Ecran de conectare i interogare

n acest sens, n fiierul care implementeaz formularul de introducere a


parametrilor de intrare se adaug codul urmtor (practic un input suplimentar)
pentru preluarea de la tastatur a parolei (fig. 2.6):
Parola: <input type="password" name="parola" size="15">
<br>
<h4>Date de interogare:</h4><br>
n acest caz, suplimentar n scriptul PHP propriu-zis pot apare urmtoarele
completri de cod (verificnd reuita sau nereuita conectrii la serverul MySQL):
<?php
//Preluarea cu metoda POST a parametrilor transmii de ctre fiierul
// HTML, scriptului PHP
$parola=$_POST[parola];
$nume=$_POST[nume];
$varsta=$_POST[varsta];
// Conectare cu parol ca parametru
$con = mysql_connect("localhost","root",$parola);
// Returnare ntr-o variabil a unui mesaj (string) de eroare,
// dac apare o eroare la conectare ->mesaj
$var=mysql_error();
if (!$con){
// Verific reuita conectrii
echo "<br><h3>".$var."</h3><br>";
//afieaz mesaj eroare (fig. 2.7)
echo "<h1><center> Parola este incorecta!</center>
</h1>";
}
else {. .
.
.
.
.
// continuare program
.
.
.
.
.
.
}
?>
Dac serverul MySQL dispune de un cont utilizator fr nume de user i
password, comanda mysql_connect (din exemplul anterior) este de forma:
mysql_connect("localhost"," "," ");

78

PHP - 2

Fig. 2.7 Parol incorect

n exemplul anterior, fiind vorba de o conexiune securizat (printr-o parol)


la un server de baze de date MySQL, parola user-ului utilizat este stocat implicit
criptat pe server (n tabela user a bazei de date speciale mysql). Dac ns, aplicaia
Web n sine implic conturi de acces direct la ea (i nu la serverul de baze de date
protejat implicit prin useri / parole propri), este necesar definirea unor useri proprii
aplicaiei, mpreun cu parolele lor aferente (stocate ntr-o tabel a aplicaiei creat
special pentru acest scop). Fiind vorba de stocarea unor informaii vitale pentru
securizarea aplicaiei (parole de acces), n mod normal acestea sunt salvate criptat
n baza de date. Deci, la crearea acestor conturi de acces user/parol, anterior
salvrii lor n baza de date, parolele trebuie generate criptat. PHP pune la dispoziie
mai multe funcii destinate criptrii informaiei (md5, hash, sha1, etc.), iar pentru
exemplificare n paragraful de fa se prezint un caz de utilizare al funciei md5.
n primul rnd trebuie generat valoare criptat a parolei dorite:
$parola=clar33;
$parola=md5($parola);
echo Valoarea criptata -32 caractere: .$parola;
Rezultatul afiat pe ecran este:
Valoarea criptata - 32 caractere: e3e99e29de40ee1c050132e2eb28d4d6
Acest string de 32 de caractere reprezint parola criptat, fiind salvat n
baza de date.Presupunnd parola introdus de la tastatur prin intermediul unei
casete INPUT, a unui formular POST, i transmis prin variabila parametru
$_POST[parola], verificarea corectitudinii ei se face criptnd coninutul ei (introdus
de la tastatur) i comparndu-l cu coninutul parolei criptate memorat n baza de
date. Altfel spus, nu se face o comparare a unui string decriptat cu alt string
decriptat, neputndu-se vorbi de decriptare n cazul algoritmului md5. Paii de
parcurs pentru verificarea unei parole ar fi:
- citire parola de la tastatur -> $_POST[citita]
- extragere parol criptat (din baza de date) -> $criptat
- comparare coninuturi criptate:
if ($criptat==md5($_POST[citita]) {cod}
c) Interogare cu cutare aproximativ
Singura modificare din script apare n linia de specificare a interogrii SQL
efective (de remarcat folosirea n comanda de interogare a ghilimelelor pentru

2.4. Dezvoltare de aplicaii PHP cu baze de date MySQL

79

ncadrarea variabilelor al cror coninut este interpretat ca un string/ir de


caractere, respectiv lipsa acestor ghilimele n cazul variabelelor coninnd valori
numerice):
$query =mysql_query("SELECT * FROM table1 where nume>$nume and
varsta>=$varsta");
Rezultatele pot fi urmtoarele:
- dac n caseta INPUT corespunzatoare numelui nu se introduce nici o
valoare, iar n cea corespunzatoare vrstei se introduce valoarea 0, vor fi afiate
toate nregistrrile bazei de date;
- dac se introduce un ir de caractere pentru nume, iar dac n caseta
INPUT corespunzatoare varstei se intoduce valoarea 0, se vor afia toate
nregistrrile pentru care numele sunt superioare alfabetic primului caracter din irul
de caractere introdus;
d) Interogare cu ignorarea parametrilor necompletai
n acest caz este necesar urmtoarea modificare n script-ul PHP, n linia de
interogare efectiv ($query=mysql_query()), folosindu-se urmtoarea secven:
// dac nu s-a introdus nici un nume i nici o varsta
// (se folosete operatorul = = pentru comparare)
if ($nume==and $varsta ==)
$query =mysql_query("SELECT * FROM table1");
// dac s-a introdus doar un nume (operatorul !== nseamn diferit de)
if ($nume!==and $varsta ==)
$query =mysql_query("SELECT * FROM table1 where nume=$nume");
// dac s-a introdus o varsta
if ($nume==and $varsta !==)
$query =mysql_query("SELECT * FROM table1 where varsta= $varsta");
//// dac s-a introdus att un nume ct i o varsta
if ($nume!==and $varsta !==)
$query =mysql_query("SELECT * FROM table1 where nume= $nume and
varsta=$varsta");
e) Construcia dinamic a string-ului de interogare SQL
Analiznd scriptul PHP precedent, se poate constata c, pentru 2 parametri
de cutare, numrul de combinaii ale string-lui implementnd comanda SQL de
interogare, presupunnd o completare parial a criteriilor de filtrare (unele casete
neconinnd date), este de

22 4 ,

iar prin extrapolare, pentru 3 parametri

23 8
n
la 2 ).

i aa mai departe crescnd exponenial (pentru n parametri ajungnd


Structura de cod anterioar nu prezint o alternativ viabil pentru cazul unui
numr mare de parametri (INPUT), considerai ca date de intrare dup care se face
interogarea tabelei, n contextul n care doar o parte dintre ei sunt cunoscui/folosii
(i deci, aleatoriu, o serie de casete de intrare nu vor conine date).
Soluia n acest caz o constituie construcia dinamic a unui singur string
generalizat de interogare, valabil pentru n parametri afereni clauzei WHERE.
Tehnica propus implic o verificare succesiv a coninutului fiecarei casete
(parametru) de intrare, respectiv concatenarea sau nu, la un string iniial SQL, a
cte unei condiii suplimentare de filtrare. Astfel, string-ul SQL se genereaz

80

PHP - 2

interactiv, dinamic, crescnd prin concatenri succesive de condiii suplimentare


(substring-uri), iar numrul de verificri ale completrii cu date pentru n casete de
n

intrare se reduce rezonabil fa de soluia anterioar, scznd la 2 la n.


Un exemplu concret este prezentat pentru cazul a 4 parametri de intrare i
interogare ($p1, $p2, $p3, $p4), mai mult sau mai puin cunoscui, folosii pentru
condiionarea interogrii unei tabele TEST cu 4 coloane (prima de tip numeric,
respectiv celelalte de tip caracter). n faza de testare a scriptului se recomand o
afiare a string-ului de interogare construit dinamic, pentru a permite o inspectare
vizual a lui n vedere detectarii unor eventuale erori de sintax (spaii lips, spre
exemplu). Secvena de cod implementnd o posibil contrucie dinamic a stringului comenzii SQL este urmtoarea:
$interogare="select * from test where ";
// verific primul parametru
if (!empty($p1))
$interogare=$interogare."c1=$p1 and ";
// verific al 2-lea parametru
if (!empty($p2))
$interogare=$interogare."c2=$p2 and ";
// verific al 3-lea parametru
if (!empty($p3))
$interogare=$interogare."c3=$p3 and ";
// verific al 4-lea parametru
if (!empty($p4))
$interogare=$interogare."c4=$p4 and ";
// adaug condiie final pentru sintax valid comand SQL
$interogare=$interogare."c1>0";
echo $interogare;
//afiez string SQL pentru inspecie vizual
Prima linie genereaz suportul de baz al comenzii SQL, la acest string fiind
concatenate dinamic construcii suplimentare. Pentru fiecare parametru coninnd
date, un substring suplimentar este concatenat string-ului de baz. O problem de
finalizare a construciei string-ului de interogare apare n situaia n care nici un
parametru nu conine date, iar soluia adoptat const n finalizarea tot timpul a
string-ului SQL prin concatenarea unei condiii statice, permanent ndeplinite (n
cazul de fa, c1>0, presupunnd coloana c1 cheie primar, spre exemplu). Un
asemenea artificiu rezolv i problema lipirii de operatorul logic AND (ncheind
fiecare substring condiional aferent unui parametru non-vid), a unei condiii
necesare doar sintactic, dar fr nici o influen asupra rezultatului interogrii. Iat
i cteva exemple de string-uri
de interogare generate astfel, n contextul
exemplului considerat:
- toi parametri de intrare completai cu date:
select * from test where c1=2 and c2=ion and c3=ing and c4=da and c1>0
- doar primul parametru nenul:
select * from test where c1=2 and c1>0
- toi parametri de intrare nuli:
select * from test where c1>0
Evident exist i alte soluii de construcie dinamic a string-ului de
interogare, dar din punct de vedere al minimizri numrului de verificri efectuate
prin secvene IF, algoritmul propus este optim. Astfel, o soluie alternativ poate
aborda problema printr-o construcie iniial a stringului integrnd din start condiia
permanent ndeplinit (doar din considerente de generare a unei construcii SQL

2.4. Dezvoltare de aplicaii PHP cu baze de date MySQL

81

valide sintactic, indiferent de numrul de parametrii folosii pentru interogare),


codul PHP fiind urmtorul:
$interogare="select * from test where c1>0 ";
if (!empty($p1))
$interogare=$interogare." and c1=$p1 ";
if (!empty($p2))
$interogare=$interogare." and c2=$p2 ";
if (!empty($p3))
$interogare=$interogare." and c3=$p3 ";
if (!empty($p4))
$interogare=$interogare." and c4=$p4 ";
echo $interogare;
//afiez string SQL pentru inspecie vizual
Singurul dezavantaj al soluiilor de genul celor anterior prezentate const n
faptul c, asupra tabelei bazei de date se aplic o clauz suplimentar de filtrare,
fr nici o valoare practic (fiind permanent ndeplinit) i avnd drept unic scop
rezolvarea ct mai simpl a unei probleme de validitate sintatic a comenzii SQL
generate dinamic. Dar simplitatea codul PHP necesar face s merite acest
compromis.
f) Parametri speciali (ca dimensiune sau coninut)
O situaie special de interogare o constituie i cea n care, interogarea se
face dup o cheie mai lung, spre exemplu, un set de cuvinte, grupate toate ntr-un
acelai cmp/caset i transmise (toate) ca un singur parametru.
Un formular
de tip FORM poate conine n acest caz o caset INPUT (avnd atributul type=text,
implicit de altfel), fie o caset de tip TEXTAREA. Pentru exemplificare, n cadrul
formularului urmtor, o caset de tip TEXTAREA permite scrierea unei informaii pe
3 rnduri i 10 coloane (fiind vorba de o formatare a modului de afiare pe ecran a
informaiei, i nu de o limitare a cantitii de informaie):
<form action="unu.php" method="get">
Detalii: <textarea name="detalii" cols="10" rows="3"></textarea>
<input type="submit" value="GO" />
</form>
Evident c utilizarea unei casete TEXTAREA este necesar doar n situaia
unui volum mare de informatie (mai multe linii de text, spre exemplu). Dac nu este
vorba de o astfel de situaie, se poate folosi o simpl caset INPUT, permind
scrierea pe o singur linie.
Transferul valorii unui astfel de parametru citit ntr-o caset TEXTAREA ridic
cteva probleme. Acestea se datoreaz faptului c, coninutul parametrului poate
include spaii, coduri de sfrit de linie sau alte caractere speciale, care nu sunt
permise ntr-un string primit ca parametru de ctre un script. Aceste caractere
speciale trebuie convertite n coduri speciale specifice parametrizrii apelului unei
pagini Web.
Se consider urmtorul exemplu de apel (printr-un link) al unui script
intitulat newpage.php, care primete ca parametru de intrare coninutul variabilei
$detalii, al crei coninut a fost completat printr-un formular de genul celui anterior
prezentat (coninnd TEXTAREA). Se presupune c variabila $detalii conine
valoarea Exemplu de folosire a tag-ului Div, incluznd mai multe spaii, care nu
sunt permise ntr-un string de interogare, trimis explicit ca parametru de intrare
spre un script, prin intermediul unui link. Convertirea acestor spaii ntr-un cod
special acceptat ntr-un astfel de apel, implic folosirea unei funcii PHP speciale, i
anume urlencode(). Iat codul aferent unui mod corect de apel cu transfer al unui

82

PHP - 2

astfel de parametru (cod inclus n cadrul script-ului unu.php, care primete


parametrul de intrare $detalii de la formularul anterior):
<a href="newpage.php?detalii=<?php echo(urlencode($detalii)); ?>">
O legatura parametrizata</a>
Se poate observa o includere de cod PHP n mijlocul unei etichete HTML. O
form i mai simpl de apelare, similar ca efect cu cea anterioar, este
urmtoarea:
<a href="newpage.php?detalii=<?=urlencode($detalii)?>">
O legatura parametrizata </a>
n ambele cazuri, funcia urlencode() preia caracterele speciale (spre
exemplu, spaiile) dintr-un string pasat ca parametru i le convertete n coduri
speciale necesare i acceptate n cadrul unui apel parametrizat al unei pagini Web.
Pentru cazul unei valori particulare: $detalii=Exemplu de folosire a tag-ului Div,
aceast funcie convertete acest coninut ntr-un string de forma Exemplu+de+
folosire+a+tag-ului+Div, acceptat ca parametru valid. Dup apelul scriptului cu
parametrul astfel codat, PHP realizeaz automat conversia invers (n cadrul
scriptului apelat -newpage.php-), la valoarea iniiala, n momentul utilizrii variabilei
$detalii.
Observaie: Funcia urlencode() se folosete doar n cadrul unei pasri de parametrii
direct printr-un hyperlink explicit (href, evident folosind metoda GET), nefiind
necesar utilizarea ei explicit dac transmiterea parametrilor se face prin
intermediul unui formular FORM (codarea fcndu-se n acest caz automat). Cu alte
cuvinte, un formular FORM interpreteaz adecvat un string coninnd caractere
speciale sau spaii i-l transmite mai departe ca parametru, n formatul adecvat
(nefiind nevoie se utilizarea explicit a funciilor urlencode sau urldecode)
n situaia n care se dorete afiarea unui volum compact mai mare de
informaii (preluat, spre exemplu, dintr-un cmp de tip TEXT al unei tabele
MySQL), este necesar uneori o formatare a acesteia. Figura 2.8 prezint afiarea
unei informaii neformatate (liniile ntinzndu-se pe toat limea ecranului, iar dac
ar depi-o, ar apare bara de scroll orizontal pentru fereastr).

Fig. 2.8. Afiare informaie neformatat (nowrap)

O soluie simpl de rezolvare presupune utilizarea etichetei DIV cu


parametrii afereni setai corespunztor. Astfel, dac n celulele aferente coloanei
detalii a tabelului din figura 2.8 se folosete o construcie de genul:
<td><div style=height: 100px;width: 330px; overflow: auto>....continutul
coloanei/variabila...</div></td>,

2.4. Dezvoltare de aplicaii PHP cu baze de date MySQL

83

rezultatul formatrii este prezentat n figura 2.9, observndu-se o mbuntaire


evident a design-ului.

Fig. 2.9. Afiare informaie formatat cu eticheta DIV

2.4.5. Adugare ntr-o tabel a bazei de date


i n cazul operaiei de adugare a unei noi linii ntr-o tablel a unei baze de
date MySQL este necesar utilizarea unui fiier HTML pentru transmiterea spre
scriptul PHP propriu-zis a valorilor corespunztoare liniei care va fi adugat n
tabel:
<html>
<title>Adaugare</title>
<center><head><H1>Adaugare</H1></head></center>
<form method="POST" action="http://localhost/ex3.php">
<table border=10 align=center BGCOLOR="Silver">
<td>
// &nbsp: realizeaz introducerea unor spaii suplimentare de formatare a
//afirii tag-ul <strong> bold-uiete textul ncadrat
<strong>Nr:</strong>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp
<input type="text" name="nr" size="4" ><br>
<strong>Nume:</strong>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
&nbsp;&nbsp;&nbsp
<input type="text" name="nume" size="10" ><br>

84

PHP - 2

<strong>Varsta:</strong>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
&nbsp;&nbsp;&nbsp
<input type="text" name="varsta" size="4" ><br>
<strong>Localitate:</strong>&nbsp;&nbsp
<input type="text" name="localitate" size="10" ><br>
<center>
<input type="SUBMIT" value="Adauga" >
<input type="RESET" value="Reset" >
</center>
</td>
</table>
</form>
</html>
Acest fiier HTML permite (n cazul de fa) transmiterea valorilor a patru
parametrii (nr, nume, varsta, localitate - cu valori introduse de la tastatur) afereni
datelor necesare construciei unei noi linii care va fi adugat n tabela bazei de date
(s-a presupus existena unei tabele similare cu cea folosit n exemplele anterioare,
dar avnd n plus cmpul NR, cu valori unice pentru fiecare articol, deci definit ca
PRIMARY KEY).
Scriptul PHP spre care sunt transmise valorile parametrilor i care va realiza
adugarea propriu-zis n tabela bazei de date are urmtorul cod:
<?php mysql_connect("localhost","root","parola") or die ("Nu se poate conecta la
serverul MySQL");
mysql_select_db("persoane") or die("Nu se poate selecta baza de date");
$nr=$_POST[nr];
$nume=$_POST[nume];
$varsta=$_POST[varsta];
$localitate=$_POST[localitate];
// adugare parametrizat
$query=mysql_query("insert into table1
values($nr,$nume,$varsta,$localitate)");
echo "Inserare reusita!!!";
// selectarea i afiarea doar a nregistrrii/liniei nou adugate
$query=mysql_query("select * from table1 where nr=$nr");
//calculeaz nr. de nregistrri returnate prin interogare
$nr_inreg=@mysql_num_rows($query);
if ($nr_inreg>0){
echo "<center>";
echo "S-au gasit " . $nr_inreg . " inregistrari";
echo"</center>";

2.4. Dezvoltare de aplicaii PHP cu baze de date MySQL

85

echo "<table border=2 align=center>";


$coln=mysql_num_fields($query); //nr. de campuri
echo"<tr bgcolor=silver>";
// realizare automat a capului de tabel (coninnd toate cmpurile)
for ($i=0; $i<$coln; $i++){
//numele cmpurilor ca i cap de tabel
$var=mysql_field_name($query,$i);
echo "<th> $var </th>";
}
echo"</tr>";
// afieaz nregistrrile gsite n urma interogarii
while($row=mysql_fetch_row($query)){
echo"<tr>";
foreach ($row as $value){
echo "<td>$value</td>";
}
echo"</tr>";
}
echo"</table>";
}
else{
echo"<center>";
echo "Nu s-a gasit nici o inregistrare!!!";
echo"</center>";
}
mysql_close();
?>

Fig. 2.10 Confirmare adugare

Rezultatul vizibil pe ecran, produs n urma execuiei comenzii SQL de afiare


SELECT este prezentat n fig. 2.10. Comanda INSERT nu genereaz un rezultat

86

PHP - 2

vizibil pe ecran, mai precis nu va returna eventuale date care ar putea fi afiate, cel
mult aprnd un mesaj de eroare dac operaia de adugare nu poate fi executat.
Observaie: n locul unei comenzi mysql_query("SELECT) compacte, se poate scrie
echivalent:
//string de interogare memorat ntr-o variabil
$com= select * from table1;
$query=mysql_query($com);
//interogare
Soluia este recomandat mai ales n cazul construciei dinamice a string-ului
de interogare, permind o eventual afiare i inspectare vizual a acestuia.

2.4.6. tergere cu confirmare dintr-o tabel a bazei de date


tergerea unor articole/linii dintr-o tabel a unei baze de date (tergere
presupus a fi cu o confirmare prealabil) implic dou operaii:
- realizarea unei interogri a bazei de date (pe baza unor parametri de intrare
pentru interogare) i afiarea nregistrrilor gsite, care vor fi terse,
- respectiv, confirmarea (sau anularea) tergerii efective, pe baza informaiilor
anterior afiate n urma interogrii.
Fiierul HTML (ex4.html) pentru realizarea unei interogri a tabelei n
vederea tergerii (interogare fcut cu un singur parametru -nume- introdus de la
tastatur) este detaliat n listingul urmtor (avnd rezultatul prezentat n fig. 2.11):

Fig. 2.11 Pagin HTML pentru tergere selectiv

<html>
<title>Stergere</title>
<center> <head><H1>Stergere</H1></head></center>
<form method="POST" action="http://localhost/ex4.php">
<table border=20 bordercolor="red" align=center BGCOLOR="Gold">
<td>
Nume:<input type="text" name="nume" size="10" ><br>
<center>
<input type="SUBMIT" value="Sterge" >
<input type="RESET" value="Anulare" >
</center>

2.4. Dezvoltare de aplicaii PHP cu baze de date MySQL

87

</td>
</table>
</form>
</html>
Fiierul PHP pentru interogarea prealabil tergerii (cu rolul: gsete i
vizualizeaz ce se dorete a fi ters), este prezentat n continuare (acest fiier
primind ca parametru de intrare valoarea pasat spre el de ctre scriptul HTML
anterior):
<?php
mysql_connect("localhost","root","parola") or die ("Nu se poate conecta la serverul
MySQL");
mysql_select_db("persoane") or die("Nu se poate selecta baza de date");
// transfer valoare parametru ntr-o variabil intern
$nume=$_POST[nume];
// cutare dup cmpul nume a nregistrrilor care vor fi terse
$query=mysql_query("select * from table1 where nume=$nume");
//calculeaz nr. de nregistrri returnate prin interogare
$nr_inreg=@mysql_num_rows($query);
if ($nr_inreg>0){
echo "<center>";
echo "S-au gasit " . $nr_inreg . " inregistrari";
echo"</center>";
// creare tabel pentru afiare rezultate
echo "<table border=2 align=center>";
//numrare cmpuri
$coln=mysql_num_fields($query);
echo"<tr bgcolor=silver>";
// realizare automat a capului de tabel (coninnd toate cmpurile)
for ($i=0; $i<$coln; $i++){
//numele cmpurilor ca i cap de tabel
$var=mysql_field_name($query,$i);
echo "<th> $var </th>";
}
echo"</tr>";
// extragere informaii i afiare
while (list ($nr,$nume,$varsta,$localitate) =
mysql_fetch_row($query)){
print (" <tr>\n".
" <td>$nr</td>\n".
" <td>$nume</td>\n".
" <td>$varsta</td>\n".
" <td>$localitate</td>\n".
" </tr>\n");
}
echo"</table>";
// Apelarea scriptului de tergere efectiv/anulare (cu transmitere mai

88

PHP - 2

// departe a parametrilor de intrare, n cazul de fa nume dup care


// se face cutarea)
echo <form method="POST"
action="http://localhost/ex44.php">;
// pasare, transmitere mai departe a parametrului nume ($nume)
// sub numele nume1
// Atenie la ordinea i tipul ghilimelelor sau "!
echo <input type="hidden" name="nume1"
value=.$_POST[nume].>;
echo <input type="SUBMIT" value="Stergere efectiva
">;
echo <br>;
echo </form>;
// link pt. revenire la pagina de start i anulare tergere
echo <a HREF="http://localhost/ex4.html">
Renunt si revin...</a>;
}
else
die("Nu gasesc nici o inregistrare ...");
mysql_close();
?>
Pentru afisarea rezultatelor obinute n urma interogarii, anterior s-a folosit
comanda PHP list( ), care permite asignarea de valori unei liste de variabile
(asemntoare practic unui ir), printr-o singur operaie, valorile asignate fiind cele
extrase cu ajutorul functiei mysql_fetch_row(). Dup cum se poate vedea i n fig.
2.12, fiierul PHP anterior prezentat, realizeaz, ntr-o prim etap, o simpl
interogare a tabelei bazei de date, cu afiarea rezultatelor pe ecran.

Fig. 2.12. Confirmare tergere

Ceea ce confer posibilitatea lurii deciziei de tergere a articolelor astfel


vizualizate se realizeaz prin partea de cod inclus n bucla if (verificnd numrul de
linii gsite), constnd practic ntr-un formular HTML <form>. Aceast parte este

2.4. Dezvoltare de aplicaii PHP cu baze de date MySQL

89

urmtoarea (PHP trimind practic spre ecran un script HTML folosind comanda
echo) :
echo <form method="POST" action="http://localhost/ex44.php">;
echo <input type="hidden" name="nume1" value= .$_POST[nume]. >;
echo <input type="SUBMIT" value="Stergere efectiva!
" >;
echo <br>;
echo </form>;
Secvena de cod prezentat, transmite valoarea parametrului de interogare,
memorat n variabila $nume (utilizat aici pentru o simpl afiare cu SELECT), spre
un alt parametru (nume1) care va fi pasat spre fiierul PHP de tergere efectiv. Se
remarc n acest caz, tipul type="hidden" utilizat pentru caseta de transfer a
parametrului, care face aceast caset invizibil pentru utilizator.
Fiierul pentru tergere efectiv are n acest caz o structur extrem de
simpl:
<?php
mysql_connect("localhost","root","parola") or die ("Nu se poate conecta la serverul
MySQL");
mysql_select_db("persoane") or die("Nu se poate selecta baza de date");
$nume1=$_POST[nume1] or die("Comanda esuata!");
// tergere efectiv
$query =mysql_query("DELETE FROM table1 where nume=$nume1");
echo "OK, am sters.";
mysql_close ();
?>

2.4.7. Modificarea unei linii dintr-o tabel a bazei de date


Modul de modificare a unei nregistrri/linii dintr-o tabel a unei baze de
date (cu vizualizarea liniei care se modific) presupune urmtoarele etape:
- o operaie de cutare parametrizat a nregistrrii care se dorete a fi modificat i
o afiare a ei;
- modificarea efectiv (folosind afiarea realizat).
Fiierul pentru transmiterea parametrilor de cutare a nregistrrii care se
dorete a fi modificat (cutarea fcndu-se dup doi parametrii vezi fig. 2.13)
este urmtorul:
<html>
<title>Cautare pentru modificare</title>
<center> <head><H1>Cautare pentru modificare</H1></head></center>
<form method="POST" action="http://localhost/ex5.php">
<table border=10 align=center BGCOLOR="Silver">
<td>
Nume: <input type="text" name="nume" size="10" ><br>
Virsta: <input type="text" name="virsta" size="4" ><br>
<input type="SUBMIT" value="Cauta" >
<input type="RESET" value="Reset" >
</td>
</table>
</form>
</html>

90

PHP - 2

Fig. 2.13. Cutare pentru modificare (practic o simpl cutare)

Fiierul pentru interogare n vederea modificrii are urmtorul cod:


<?php
mysql_connect("localhost","root","parola") or die ("Nu se poate conecta la serverul
MySQL");
mysql_select_db("persoane") or die("Nu se poate selecta baza de date");
$nume=$_POST[nume];
$varsta=$_POST[varsta];
// cutarea nregistrrii care va fi modificat
$query=mysql_query("select * from table1 where nume=$nume and
varsta=$varsta");
$nr_inreg=@mysql_num_rows($query);
if ($nr_inreg>0){
echo "<center>";
echo "S-au gasit " . $nr_inreg . " inregistrari";
echo"</center>";
echo "<table border=2 align=center>";
echo"<tr bgcolor=silver>";
$coln=mysql_num_fields($query);
for ($i=0; $i<$coln; $i++){
$var=mysql_field_name($query,$i);
echo "<th> $var </th>";
}
echo"</tr>";
$nr_val=0; // contor indice array
while ($row = mysql_fetch_row($query)){
echo"<tr>";
foreach ($row as $value) {
echo "<td BGCOLOR=Yellow> $value</td>";

2.4. Dezvoltare de aplicaii PHP cu baze de date MySQL

91

// memorare ntr-un ir (array) a datelor din articolul gsit


$nr_val++;
$sir[$nr_val]=$value;
}
echo "</tr>";
}
echo "</table>";
// Rezolvarea este valabil pentru o singur nregistrare gsit
// Pentru mai multe nregistrri gsite, modificrile efectuate se aplic
//asupra tuturor liniilor care corespund cutrii
echo <br><hr>; // trasarea grafic a unei linii
// apel script pentru modificarea efectiv
echo <form method="POST" action="http://localhost/ex55.php">;
// transfer (ascuns) spre script a parametrilor de cutare
echo <input type="hidden" name="nume2" value=.$sir[2].>;
echo <input type="hidden" name="varsta2" value=.$sir[3].>;
// transfer spre script ca parametrii a datelor care pot fi modificate
echo <input type="text" name="nr1"
value=.$sir[1].>;
echo <input type="text" name="nume1" value=.$sir[2].>;
echo <input type="text" name="varsta1" value=.$sir[3].>;
echo <input type="text" name="localitate1" value=.$sir[4].>;
echo <input type="SUBMIT" value="Modifica!" >;
echo <br>;
echo </form>;
// link de revenire i renunare la modificare
echo <a HREF="http://localhost/ex5.html"> Renun i revin...</a>;
}
else
die ("Nu gasesc nici o inregistrare ...");
mysql_close();
?>
Rezultatul fiierului script PHP anterior, este prezentat n figura 2.14. Ceea
ce aduce nou acest script PHP, pe lng o simpl interogare (cutare cu SELECT) i
afiare a articolelor gsite pe ecran (tabelat), const ntr-o afiare n casete editabile
a datelor gsite, permindu-se astfel i o modificare a lor (vezi fig. 2.14). Cum se
realizeaz acest lucru?
n primul rnd, n bucla foreach() ncuibat n bucla while(), apare o
secven de genul:
//incrementare contor numr elemente
$nr_val++;
// memorare ntr-un ir (array) a datelor din articolul gsit
$sir[$nr_val]=$value;
care permite memorarea tuturor elementelor gsite ntr-un ir (arrary-ul $sir).

92

PHP - 2

Fig. 2.14. Ecran pentru modificare

Spre exemplu, n cazul de fa (vezi fig. 2.14) s-a gsit un singur articol cu
4 elemente, acestea memorndu-se ntr-un ir avnd 4 elemente (cu indicii 1,2,3 i
4, deoarece contorul $nr_val a fost iniializat pe 0, dar este incrementat nainte de
folosirea lui ca indice al unui element al irului $sir).
n al doilea rnd, este utilizat secvena urmtoare:
echo <form method="POST" action="http://localhost/ex55.php">;
// Transfer (ascuns) spre script a parametrilor de cutare
echo <input type="hidden" name="nume2" value=.$sir[2].>;
echo <input type="hidden" name="varsta2" value=.$sir[3].>;
// Transfer spre script ca parametrii a datelor care pot fi modificate
echo <input type="text" name="nr1"
value=.$sir[1].>;
echo <input type="text" name="nume1" value=.$sir[2].>;
echo <input type="text" name="varsta1" value=.$sir[3].>;
echo <input type="text" name="localitate1" value=.$sir[4].>;
echo <input type="SUBMIT" value="Modifica!" >;
echo <br>;
echo </form>;
Primele tag-uri <INPUT type=hidden permit transferul spre fiierul script
PHP care realizeaz modificarea efectiv a parametrilor iniiali de interogare
(memorai n primele dou elemente ale array-ului $sir), acest lucru fiind necesar
deoarece aceti parametrii pot fi alterai n urma unei eventuale modificri permise
n continuare, dup cum se va vedea.
Urmtoarele 4 tag-uri <INPUT type=text permit afiarea (n casete care
permit att operaii de citire ct i de scriere) i alterarea (modificarea) acestor
patru parametrii, care vor substitui informaia existent n cmpurile articolului
localizat (cu parametrii transmii din primele dou INPUT-uri invizibile utilizatorului).
Cu alte cuvinte, aceast secvena transfer spre script-ul PHP de modificare efectiv
ase parametrii:

2.4. Dezvoltare de aplicaii PHP cu baze de date MySQL

93

doi parametrii pentru localizarea articolului de modificat;


ali patru parametrii, pentru substituirea informaiei din cele patru
cmpuri ale articolului deja localizat.
Fiierului PHP care realizeaz modificarea propriu-zis, utiliznd comanda
SQL UPDATE, nu i mai revine dect o sarcin banal:
<?php
mysql_connect("localhost","root","parola") or die ("Nu se poate conecta la serverul
MySQL");
mysql_select_db("persoane") or die("Nu se poate selecta baza de date");
$nr1=$_POST[nr1];
$nume1=$_POST[nume1];
$varsta1=$_POST[varsta1];
$localitate1=$_POST[localitate1];
$nume2=$_POST[nume2];
$varsta2=$_POST[varsta2];
// Modificare efectiv
$query =mysql_query("update table1 set nr=$nr1,nume=$nume1,
varsta=$varsta1,localitate=$localitate1 where nume=$nume2 and
varsta=$varsta2") or die("Comanda esuata!");
// Afiare mesaj de eroare pentru date incorect introduse (dac se
dorete)
$var=mysql_error();
echo $var;
echo "OK, am modificat!";
mysql_close ();
?>

2.4.8. Aplicaie exemplu cu operaii SQL multiple


Se consider baza de date MySQL angajati, coninnd tabela salarii cu
urmatoarele cmpuri:
-id integer primary key;
-nume varchar(14);
-salar_brut float;
-impozit float;
-salar_net float;
Se dorete implementarea unei aplicaii care:
- folosete un prim fiier HTML (exempluFinal.html) prin intermediul cruia se preiau
de la tastatura id-ul, numele i salarul _brut al unui angajat, i sunt transmise
valorile acestor parametri catre un script PHP (exempluFinal.php). n cadrul
scriptului PHP se efectuez urmatoarele operatii:
- inserarea (adugarea) n tabela salarii a informaiilor primite (ca linie
nou);
- realizarea unui update pe tabel pentru calculul impozitului i a salariului
net al angajailor cu urmtoarele formule:
- impozit=0.16*salar_brut;
- salar_net=salar_brut - impozit;
- afiarea tuturor angajailor existeni n tabel.

94

PHP - 2

Tabela MySQL (considerat a fi inclus n baza de date angajati) a fost


creat folosind comanda:
CREATE TABLE salarii(
id integer primary key,
nume VARCHAR (14),
salar_brut FLOAT,
impozit FLOAT,
salar_net FLOAT);

Fig. 2.15. Formular HTML pentru preluarea parametrilor de la tastatur

Fiierul exempluFinal.html are urmtorul cod posibil (fig. 2.15):


<html>
<form method="POST"
action="http://localhost/exempluFinal.php">
<table border=10 align=center BGCOLOR="Silver">
<td>
Id: <input type="text" name="id" size="4"><br>
Nume: <input type="text" name="nume" size="10"><br>
Salar_brut: <input type="text" name="salar_brut"
size="4"><br>
<input type="SUBMIT" value="Insert" >
<input type="RESET" value="Reset" >
</td>
</table>
</form>
</html>
Fiierul exempluFinal.php are codul urmtor (vezi i fig.2.16):
<?php
mysql_connect(localhost,root,parola) or die (Nu se poate conecta la serverul
MySQL);

2.4. Dezvoltare de aplicaii PHP cu baze de date MySQL

95

mysql_select_db(angajati) or die(Nu se poate selecta


baza de date);
echo<br><br>;
$id=$_POST['id '];
$nume=$_POST['nume '];
$salar_brut=$_POST['salar_brut '];
// COMENZI SQL SUCCESIVE
$query=mysql_query("insert into salarii
(id,nume,salar_brut) values($id,$nume,$salar_brut) ");
$query=mysql_query("update salarii set
impozit=0.16*salar_brut,salar_net=salar_brut-impozit where id=$id") or
die("Comanda esuata!");
$query=mysql_query("select * from salarii");
$nr_inreg=@mysql_num_rows($query);
if ($nr_inreg>0){
echo <center>;
echo S-au gasit . $nr_inreg . inregistrari;
echo</center>;
// cap tabel
echo <table border=2 align=center>;
$coln=mysql_num_fields($query);
echo<tr bgcolor=silver>;
for ($i=0; $i<$coln; $i++){
$var=mysql_field_name($query,$i);
echo <th> $var </th>;
}
echo</tr>;
// afiare date
while($row=mysql_fetch_row($query)){
echo<tr>;
foreach ($row as $value){
echo <td>$value</td>;
}
echo</tr>;
}
echo</table>;
}
else{
echo<center>;
echo Nu s-a gasit nici o inregistrare!!!;
echo</center>;
}
mysql_close(); ?>
Rolul acestui exemplu este de a arta c un fiier script PHP poate conine
oricte comenzi SQL sunt necesare pentru ndeplinirea funcionalitilor dorite. Se
poate observa de asemenea c, comenzi precum UPDATE (sau DELETE) pot fi uneori
folosite pentru realizarea unor modificri/actualizri ntr-o tabel, fr nici o
confirmare prealabil din partea utilizatorului.

96

PHP - 2

Fig. 2.16. Afiarea nregistrrilor gsite

Observaie: Pentru a determina numrul de linii returnate de o interogare


SELECT se poate folosi funcia mysql_num_rows. Dac se dorete determinarea
numarului de linii afectate de o comand INSERT, DELETE sau UPDATE, funcia
funcia corespunztoare este mysql_affected_rows.

2.4.9. Interogare cu extragerea date dintr-o coloan BLOB


O situaie mai deosebit de operare cu baze de date MySQL o constituie
interogarea cu extragerea unei imagini dintr-un cmp de tip BLOB (Binary Large
OBject), respectiv afiarea acelei imagini. Se vor prezenta n continuare dou soluii
care rezolv aceast problem. Un prim exemplu de script are urmtorul cod PHP:
<?php
// configurare MIME
header("Content-type: image/jpg");
$query="select imag from tabela2 where id=1";
mysql_connect("localhost", "root", "parola")or die ("nu gasesc serverul MySQL");
// print ("Connected successfully");
// o linie de genul celei anterioare este INTERZISA
// NU SE REALIZEAZA NICI O ALT IEIRE DE ALT TIP PE ECRAN
mysql_select_db ("ioji")or die ("Nu gasesc baza");
$result = mysql_query($query);
// Extragere rezultat (binar)
$var=mysql_fetch_row($result);
// Trecere de la tip ir la tip variabila
$var1=$var[0];
print($var1); // sau direct, print($var[0]);
?>

2.4. Dezvoltare de aplicaii PHP cu baze de date MySQL

97

Esenial n acest caz este linia prin care este setat specificaia MIME
(Multipurpose Internet Mail Extension) pentru afiarea unei imagine JPG. Aceasta
nsemn c orice ieire spre browser, va fi interpretat ca i coninut al unei imagini
jpg, i afiat corespunztor. Dup o astfel de setare, realizat la nceputul
scriptului, nu este permis nici o alt ieire (de un alt tip) spre afiare la browser.
Exemplul prezentat presupune existena unui cmp imagine de tip BLOB (sau
LONGBLOB), ntr-o tabel referit n program.
Afiarea imaginii extrase din baza de date, se face printr-o simpl directare
spre browser a coninutului variabilei (print), n care este salvat (n format binary)
imaginea propriu-zis.
n cazul (cel mai probabil) al unei interogri cu parametri, linia de interogare
se modific astfel:
$query="select imagine from tabela2 where id=$id";
unde, $id este parametrul dup care se face interogarea, iar id este un cmp
identificator din tabel.
n cazul de fa, valoarea parametrului $id se transmite, fie printr-un
formular FORM, fie direct din linia de comand a browser-ului, printr-un apel cu
parametru, de forma (spre exemplu, pentru o cale dat i un nume al fiierului
script PHP imag1.php):
http://localhost/imag1.php?id=1;
Observaie: Pentru a putea extrage date dintr-o coloan de tip BLOB, aceasta
trebuie umplut anterior cu date binare. n MySQL inserarea de date BLOB ntr-o
linie nou se poate face fie direct printr-o comand INSERT implicnd utilizarea
funciei speciale MySQL LOAD_FILE, fie printr-o comand iniial INSERT care creaz
linia nou, eventual cu date pentru celelalte coloane (mai puin cea de tip BLOB),
urmat de o comand UPDATE setnd strict coloana BLOB (folosind de asemenea
funcia special MySQL LOAD_FILE). Pentru cazul de fa, cele dou cazuri
rezolvnd problema adugrii unei linii noi coninnd informaie BLOB (o imagine) n
coloana imag a unei tabele tabela2 sunt punctate n continuare:
INSERT into tabela2 values(1, LOAD_FILE ("c:\\poza.jpg"));
sau
INSERT into tabela2 (id) values(1);
UPDATE tabela2 SET imag=LOAD_FILE("c:\\poza.jpg") where id=1;
Un al doilea exemplu script PHP, folosete un fiier imagine intermediar
(temp1.jpg) n care este extras coninutul binar al cmpului BLOB:
<?php
$query="select imagine from tabela2 where id=2";
mysql_connect("localhost", "root", "parola") or die ("nu gsesc serverul MySQL");
mysql_select_db ("ioji") or die ("Nu gsesc baza");
$result = mysql_query($query);
// Verific dac gsete o astfel de nregistrare
if (mysql_num_rows()>0)
{
// mysql_num_rows() returneaz nr. de nregistrri gsite;
$var=mysql_fetch_row($result);
$var1=$var[0];
// Deschide un fiier pentru scriere n el
$fp=fopen("temp1.jpg","wb");
// Scrie n fiier

98

PHP - 2

fwrite($fp,$var1);
fclose($fp);
// Afieaz coninutul fiierului ca imagine
echo <image src="temp1.jpg">;
}
// Dac nu gsete nimic, terge fiierul
else {
unlink("TEMP1.JPG");
// sau delete("TEMP1.JPG");
} ?>
n acest exemplu, se verific totodat existena unei nregistrri care
corespunde interogrii realizate (structura if). Dac se gsete o astfel de
nregistrare, se salveaz coninutul cmpului BLOB ntr-un fiier (cu extensia jpg), i
se afieaz practic imaginea stocat de acest fiier. Pentru o nou interogare
reuit, acest fiier va fi suprascris. n caz de interogare nereuit, fiierul
intermediar va fi ters (pentru a nu se afia ultima imagine gsit).
Verificarea gsirii unei nregistrri care corespunde condiiei de interogare,
este asigurat de funcia: mysql_num_rows(). Aceast funcie returneaz numrul
de linii gsite de o comand SQL SELECT.
Observaie: Asupra lucrului cu fiiere n PHP se va reveni ntr-un paragraf ulterior.
Numrul funciilor PHP pentru lucrul cu baze de date MySQL este mult mai
mare. Prin exemplele prezentate i prin funciile specifice exemplificate, s-a dorit
doar o simpl introducere n problematica lucrului cu astfel de baze de date. Pentru
mai multe detalii, resursele bibliografice n domeniu sunt mai mult dect suficiente,
n special cele oferite pe Internet.

2.4.10. Apelul unei proceduri stocate


Toate exemplele de operare cu MySQL din paragrafele anterioare au folosit
ca mijloc de comunicare cu serverul de baze de date comenzi SQL standard
(SELECT, INSERT, UPDATE, DELETE), pasate succesiv ca string-uri de caractere spre
acesta i executate n ordinea sosirii lor pe server. Eecul uneia dintre comenzi (din
diverse motive, spre exemplu nclcarea unei constrngeri), nu bloca execuia
celorlalte apeluri SQL (care puteau reui) astfel nct, la finalul execuiei scriptului
era posibil ca datele actualizate n baza de date s nu-i mai pstreze consistenta i
valabilitatea logic. Dac se pune problema unei operri tranzacionale - ori se
execut ntregul set de comenzi SQL implicate n tranzacie, ori, n caz de nereuit
a uneia, efectul i al tuturor celorlalte este anulat o soluie elegant o constituie
apelul unei proceduri stocate. O procedur stocat poate conine oricte comenzi
SQL, justificndu-se crearea ei n cazul n care multiple operaii distincte de
actualizare (modificare/adugare/tergere) a datelor bazei de date sunt necesare i
se dorete fie execuia unitar a tuturor comenzilor, fie a nici uneia. Pentru simple
interogri SELECT, care nu modific date din tabele, nu sunt necesare apeluri de
proceduri stocate, utilizarea unor comenzi clasice SELECT (chiar succesive) fiind
soluia normal. Codul proceduri stocate (comenzi SQL) este evident salvat pe
serverul de baze de date.
n continuare este prezentat modul n care din PHP poate fi realizat un apel
de procedur stocat MySQL, aceasta asigurnd la finalizarea execuiei script-ului
PHP caracterul tranzacional al execuiei unor seturi de comenzi SQL de actualizare a
datelor din baza de date. Ca i alte sisteme de gestiune a bazelor de date, MySQL
ofer suport pentru procedurile stocate, evident cu cteva aspecte specifice lui.

2.4. Dezvoltare de aplicaii PHP cu baze de date MySQL

99

Pentru exemplificare, fie o tabel TESTUL, avnd 3 coloane de tip INT (c1,
c2, c3). Se consider o procedur stocat (numite TESTUL1), care adaug
parametrizat o linie nou n tabel (completnd cu date doar coloanele c1 i c2),
apoi pentru linia nou introdus calculeaz o valoare pentru coloana c3. La crearea
procedurii stocate, deoarece n MySQL caracterul ; (punct i virgul) semnific
ncheiere unei linii de cod (delimitator de linie), un alt caracter sau secven de
caractere trebuie definit i utilizat pentru marcarea sfritului definiiei procedurii
stocate (urmnd ca apoi s se revin la caracterul consacrat ;). Corpul procedurii
astfel create (inclusiv comanda de tergere prealabil a ei dac deja exist,
respectiv definiiile delimitatorilor necesari // i ;) este urmtorul
Drop procedure test1;
Delimiter //
Create procedure test1 (param1 int, param2 int)
Begin
Insert into testul1 (c1,c2) values(param1, param2);
Update testul1 set c3=c1+c2 where c1=param1;
End;
//
Delimiter;
Un apel al procedurii stocate (din cadrul clientului textual MySQL console),
urmat de o afiare a tabelei pentru a verifica efectul ei, este prezentat n continuare:
Call test1(101,101);
Select * from testul1;
Pentru apelul din PHP al procedurii stocate (scriptul Web jucnd rolul clientul
apelant) se poate folosi secvena urmtoare de cod (presupunnd o conexiune
valid):
$var=100;
mysql_query("call test1($var,101)") or die("Procedura esuata!");
echo ("Procedura executata!");
Observaie: O soluie simpl i comoda pentru a nu mai scrie explicit i repetat
pentru fiecare pagin script a unei aplicatii Web a setului de comenzi de conectare la
serverul de baze de date, respectiv selecie a bazei de date, o constituie crearea
unui script distinct de conectare, respectiv utilizarea comenzii PHP include() referind
acest script de conectare. Fie scriptul de conectare conectare.php:
<?php $server=localhost;
$user=root;
$passw=parola;
$db=baza;
$con=mysql_connect ("$server", "$user", "$passw") or die ("Error connecting to
mysql");
$dbf=mysql_select_db($db) or die ("Error connecting to DB"); ?>
n fiecare script al aplicaiei (site-ului) Web care necesit o conectare la
serverul MySQL, nainte de realizarea unor operaii SQL efective de interogare, se
insereaz linia urmtoare (asigurnd conectarea la serverul de baze de date):
include("conectare.php ");

2.4.11. Prevenirea problemei SQL injection


Una dintre problemele de securitate ale aplicaiilor Web cu baze de date o
constituie aa numita problem a injectrii SQL (SQL Injection). Tehnica SQL

100 PHP - 2
injection const ntr-o integrare (interactiv, prin datele de intrare) a unor poriuni
suplimentare de cod SQL care permit o ataare la interogrile SQL a unor condiii
permanent ndeplinite, anulnd astfel filtrele condiionale de securizare. [20] Astfel,
anumite combinaii de condiii ataate string-ului SQL de interogare pot s conduc
la o nou comand SQL valid, care anuleaz toate restriciile viznd accesul la
date, sau chiar conduc la crearea i trimiterea spre serverul de baze de date a unor
comenzi SQL cu cert potenial distructiv. Ideea de baz a acestei tehnici const n
faptul c, n cadrul codului script, pe baza datelor de intrare (INPUT), pot fi create
string-uri de comenzi SQL cu rol nedorit, maliios, pasate spre serverul de baze de
date i executate necondiionat de acesta. Aceste secvene ataate codului SQL
generat prin concatenri de string-uri, anuleaz condiiile de filtrare ale comenzii i
transform comanda SQL ntr-o nou comand, avnd o cu totul alt aciune dect
cea dorit.
Din fericire, la ora actual interpretoarele PHP de versiuni recente sunt
setate (prin intermediul unor valori adecvate ale variabilelor interne de stare din
fiierul de configurare php.ini) astfel nct s resping din start aceste atacuri,
interpretnd anumite forme de string-uri ca secvene maliioase i genernd.
secvene SQL adecvate, anulndu-le astfel potenialul distructiv.
Unul dintre principiile de baz ale unei injectri SQL poate fi descris succint
de urmtorul mod de construcie al string-ului de interogare:
String_interogare=comand_SQL_cu_conditii_logice. OR
secventa_conditionala malitioasa, ultima secven condiional introdus de la
tastatur fiind tot timpul adevrat (iar condiia logic OR face ca ntreaga secven
condiional s fie ndeplinit).
Pentru o nelegere a acestui tip de atac, se considera o exemplificare
concret. Fie tabelul TEST (MySQL) cu structura i datele descrise n figura 2.17.
De asemenea, se consider o aplicaie WEB care permite interogarea dup
coloanele CNP i NUME, permind afiarea linie corespunztoare datelor introduse,
interesnd afiarea informaiei aferente coloanei PIN_SECRET. Aplicaia necesit un
formular HTML pentru introducerea datelor de interogare (CNP i NUME), respectiv
un script PHP de interogare efectiv:
- Formular introducere date interogare:
<form action="temp2.php" method="POST">
CNP---><input name="param1" size=13> <br>
Nume--><input name="param2" size=13> <br>
<input type="Submit" Value="Cauta!"></form>
- Script interogare (PHP):
<?php
$query1=mysql_connect(localhost,root,);
mysql_select_db(test);
$param1=$_POST[param1];
$param2=$_POST[param2];
$query = "SELECT * FROM test WHERE cnp=$param1 and
nume=$param2";
echo $query;
$interoghez=mysql_query($query);
print(<table align=center BORDER="2">);
print ("<tr>");
echo <th BGCOLOR="Silver">ID</th>;

2.4. Dezvoltare de aplicaii PHP cu baze de date MySQL 101


echo <th BGCOLOR="Silver">CNP</th>;
echo <th BGCOLOR="Silver">PIN_SECRET</th>;
print ("</tr>");
while ($row = mysql_fetch_row($interoghez))
{ echo" <tr>\n";
foreach ($row as $value)
{
echo "<td>$value</td>";
}
echo "</tr>";
} ?>

Fig.2.17. Structura i date tabela TEST

a) n scenariul considerat, ca prim exemplificare, se realizeaz o interogare


cu parametri normali presupunnd introducerea de la tastatur a unor valori
concrete pentru CNP, respectiv NUME. Figurile 2.18.a i 2.18.b exemplific o
interogare care nu gsete nici o linie adecvat (PIN_SECRET neregsit), iar figurile
2.18.c i 2.18.d- o interogare reuit (PIN_SECRET afiat).

Fig.2.18.b. Cutare nereuit


Fig.2.18.a. Ecran interogare parametri
incoreci - protecie activ

102 PHP - 2

Fig.2.18.c. Ecran interogare


parametri coreci

Fig.2.18.d. Cutare reuit

b) Urmtoarea exemplificare presupune o interogare cu parametri


anormali, deci practic o injectare SQL. n fiierul de configurare PHP.ini protecia implicit la instalarea PHP este setat corespunztor prin valoarea
adecvat a variabilei parametru magic_quotes_gpc (semnificaia acesteia fiind
ghilimele_magice sau citate_ magice):
; Magic quotes for incoming GET/POST/Cookie data.
magic_quotes_gpc = On
n figurile 2.19.a i 2.19.b este exemplificat cazul n care, dei printr-o
injectare SQL este construit un string de interogare maliios (care impune o condiie
permanent ndeplinit), protecia implicit a interpretorului PHP nu ofer acces la
datele tabelei. Secvena de injectare SQL const n introducerea n a doua caset
(INPUT) a string-ului OR 1 (neavnd importan valoarea introdus n prima
caset), astfel nct secvena de interogare pasat spre serverul de baze de date
devine:
SELECT * FROM test WHERE cnp=orice and nume=\ OR\1
De asemenea, n figurile 2.19.c i 2.19.d este considerat o alt form de
injectare SQL, ns protecia implicit PHP i face din nou datoria, mpiedicnd
accesul la date. Astfel, secvena SQL injectat i deci alterat prin introducere n
ultim caset a secvenei de cod condiional OR=, devine:
SELECT * FROM test WHERE cnp=orice and nume=\ OR \\=\

Fig.2.19.a. Valoare introdus pentru


parametrul al doilea: OR 1

Fig.2.19.b. Cutare nereuit Protecia


implicita mpiedic injectarea sql

2.4. Dezvoltare de aplicaii PHP cu baze de date MySQL 103

Fig.2.19.c. Valoare introdus pentru


parametrul al doilea: OR =

Fig.2.19.d. Cutare nereuit! Protecia


implicita mpiedic injectarea sql

n ambele cazuri se poate observa caracterul \ , precednd de multe ori


caracterul ghilimea (prezena lui fiind un prim semn al unui posibil atac) i
genernd astfel o interogare SQL al crei potenial maliios este practic anulat (noua
condiie ataat nu este ndeplinit).
Acelai scenariu este reluat considernd dezactivat protecia intern PHP
(situaie implicit la versiuni mai vechi PHP):
magic_quotes_gpc = Off
Rezultatele sunt prezentate n figurile 2.20.a i 2.20.b, respectiv 2.20.c i
2.20.d. String-urile de interogare generate n urma injeciei SQL sunt comenzi SQL
perfect valide, avnd condiia de filtrare (clauza WHERE) adevrat tot timpul:
SELECT * FROM test WHERE cnp=orice and nume= OR 1
(condiia OR 1 fiind tot timpul ndeplinit)
SELECT * FROM test WHERE cnp=orice and nume= OR =
(condiia OR = fiind tot timpul ndeplinit)
Mai mult, se observ c n urma injectrii SQL, ntregul coninut al tabelei
TEST este accesibil, fiind practic depit bariera de protecie implicnd cunoaterea
a dou informaii (CNP i NUME) pentru a avea acces la informaia protejat
(PIN_SECRET). Practic ntreaga informaie (inclusiv CNP i NUME) din tabel este
accesibil, cu consecine imprevizibile .

Fig.2.20.a. Valoare introdusa pentru


parametrul al doilea: OR 1

Fig.2.20.b. Cutare reuit! Protecia


dezactivat permite injectarea sql i
afiarea NTREGULUI coninut al tabelei

104 PHP - 2

Fig.2.20.c. Valoare introdusa pentru


parametrul al doilea: OR =

Fig.2.20.d. Cutare reuita! Protecia


dezactivat permite injectarea sql i
afiarea NTREGULUI coninut al tabelei

i n final, un ultim scenariu care implic o protecie explicit, preventiv,


recomandat a fi folosita indiferent de setarea interpretorului PHP (deci indiferent de
valoarea variabilei magic_quotes_gpc). Soluia const n completarea scriptului PHP
anterior cu liniile de cod urmtoare:
$param1=mysql_real_escape_string($param1);
$param2=mysql_real_escape_string($param2);
plasate nainte de construcia string-ului de interogare $query folosind cei
doi parametri.
Evident, dac sunt mai muli parametri de interogare, asupra fiecruia se
aplic funcia mysql_real_escape_string, anterior interogrii (efectul acestei
funcii fiind practic similar celui obinut prin setarea adecvat pe ON a parametrului
magic_quotes_gpc din fiierul de configurare php.ini).
Paragraful de fa a tratat doar problematica unui atac Web prin tehnica
injectrii SQL, inta acestuia fiind baza de date aflat n spatele aplicaiei, codul
script propriu-zis nefiind cel direct vizat. Exist i atacuri avnd o astfel de int,
exploatnd n general bree generate prin configurarea inadecvat a serverului de
Web. Totui, n contextul dinamicii aplicaiilor Web asigurat prin preluarea
informailor din baze de date, o alterare a coninutului tabelelor atacate poate
conduce implicit i la o modificare a coninutului dinamic al site-ului.

2.5. Dezvoltare de aplicaii PHP cu baze de date Oracle


2.5.1. Interogare fr parametri
Pentru operarea cu baze de date Oracle este necesar utilizarea bibliotecii
php_oci8.dll. ca extensie PHP. Scriptul urmtor prezint o exemplificare a utilizrii
ctorva dintre funciile oferite de aceast bibliotec.
Conectarea la o baz de date Oracle se face utiliznd funcia PHP OCILogon
(parametri obligatorii ai acesteia fiind numele de user, parola i numele instanei
Oracle, implicit ORCL pentru versiunile Oracle Enterprise/Professional, respectiv XE
pentru versiunile Express). Interogarea unei tabele a unei baze de date Oracle (mai
precis, n exemplu de fa, tabela ANGAJATI avnd coloanele ID, NUME, SALAR) se
face utiliznd funciile OCIParse i OCIExecute, fiind apoi extrase i afiate succesiv
pe ecran datele din liniile aceasteia (bucla while cu OCIFetch). Apoi, n exemplul
prezentat, nregistrarile din tabela angajati sunt adugate ntr-o alt tabel
evidenta, utiliznd comanda SQL INSERT, mpreun cu comenzile PHP OCIParse i

2.5. Dezvoltare de aplicaii PHP cu baze de date Oracle

105

OCIExecute (practic, se face un transfer al informaiilor din tabela angajati n tabela


evidenta). n final sunt eliberate resursele i este nchis conexiunea cu baza de
date Oracle. Se poate observa c procedura de lucru este practic identic cu cea din
cazurile anterioare (MySQL), doar numele funciilor utilizate i sintaxa lor fiind
specifice bibliotecii extensie OCI8.
<?php
// Conectare la serverul Oracle (ultimul parametru se
// completeaz doar pentru un server Oracle la distan)
$connection = OCILogon("student", "student","ORCL");
// Interogare tabel
$stmt = OCIParse($connection, "SELECT * FROM angajati");
// Executa comanda SQL
OCIExecute($stmt);
// Generarea tabelului pentru afiarea rezultatelor obinute
echo "<table border=4 align=center>";
echo "<tr>";
echo "<th>ID</th>";
echo "<th>NUME</th>";
echo "<th>SALAR</th>";
echo "</tr>";
// Bucla pentru extragerea rezultatelor
while(OCIFetch($stmt))
{
$id= OCIResult($stmt, "ID");
$nume= OCIResult($stmt, "NUME");
$salar= OCIResult($stmt, "SALAR");
print (" <tr>\n".
" <td>$id</td>\n".
" <td>$nume</td>\n".
" <td>$salar</td>\n".
" </tr>\n");
/ / Pregtete adugarea
$stmt1 = OCIParse($connection, "INSERT into evidenta values ($id, $nume,
$salar)");
// Execut comanda (adugare)
OCIExecute($stmt1);
}
// Elibereaz resursele i nchide conexiunea
OCIFreeStatement($stmt);
OCIFreeStatement($stmt1);
OCILogoff($connection);
?>
n situatia n care datele adugate sunt i de tip dat calendaristic (de
asemenea, un tip uzual), se va folosi o funcie de conversie la un format Oracle
corespunzator (TO_DATE). [13] Spre exemplificare:
$stmt1 = OCIParse($connection, "insert into test values
($id,$nume,$salar,TO_DATE($data,YY-MM-DD))");

106 PHP - 2
Pe baza exemplului anterior, analiznd functiile specifice (OCILogon,
OCIParse, OCIExecute, OCIFetch, OCIResult, OCIFreeStatement, OCILogoff), se pot
remarca cteva deosebiri fa de cazul operrii cu MySQL. Totui, mai exist un set
de funcii (destinate Oracle) a cror sintax, respectiv funcionalitate, este foarte de
apropiat de cea a setului folosit pentru MySQL, facnd extrem de facil
transpunerea unui script opernd cu MySQL ntr-un script opernd cu Oracle. Se
consider urmtorul exemplu n acest sens:
<?php
$connection = OCI_connect("student", "student","orcl");
$stmt = OCI_Parse($connection, "SELECT * FROM angajati");
OCI_Execute($stmt);
echo "<table border=4 align=center>";
echo "<tr>";
echo "<th>ID</th>";
echo "<th>NUME</th>";
echo "<th>SALAR</th>";
echo "</tr>";
while($row=OCI_Fetch_row($stmt))
{
print (" <tr>\n".
" <td>$row[0]</td>\n".
" <td>$row[1]</td>\n".
" <td>$row[2]</td>\n".
" </tr>\n");
}
OCI_Free_Statement($stmt);
OCI_close($connection);
?>
Se pot remarca similitudinile sintactice i funcionale ale noilor funcii
utilizate, comparativ cu cele destinate MySQL-ului, aa cum este prezentat
comparativ i n tabelul 2.2:
Tabel 2.2.

Oracle
OCI_Connect

MySQL
MySQL_Connect

OCI_Parse + OCI_Execute
OCI_Fetch_Row,
OCI_Fetch_Array,
OCI_Fetch_Assoc,
OCI_Fetch_Object
Oci _Num_Rows
OCI_Close

MySQL_Query
MySQL _Fetch_Row,
MySQL_Fetch_Array,
MySQL_Fetch_Assoc,
MySQL_Fetch_Object
MySQL _Affected_Rows
MySQL_Close

2.5.2. Operare tranzacional


Aa cum s-a precizat pentru MySQL, i n cazul Oracle se poate face un apel,
dintr-un script PHP, la o procedur stocat (util n special pentru operarea
tranzacional, cu seturi de multiple comenzi SQL destinate actualizrii informaiei
din bazele de date). Pentru o exemplificare pur didactic, se consider urmtoarea
procedur stocat (cu numele joc), opernd asupra unei tabele (testul1):

2.5. Dezvoltare de aplicaii PHP cu baze de date Oracle

107

Create or replace procedure joc(par1 int, par2 int)


As
Begin
Insert into testul1 (c1,c2) values(par1, par2);
Update testul1 set c3=c1+c2 where c1=par1;
End;
/
Un script PHP care face un apel al acestei proceduri stocate poate avea
codul urmtor (remarcndu-se apelul procedurii stocate prin intermediul unui bloc
PL/SQL, specific Oracle [13]):
<?php
$connection = OCILogon("student", "student","orcl");
// Pregatire execuie bloc PL/SQL integrnd apelul procedurii
$stmt = OCIParse($connection, "BEGIN joc(222,222); end;");
// execuie procedur
OCIExecute($stmt) or die("Esec !")
echo "ok"; ?>
n cazul Oracle, operarea tranzacional (totul sau nimic) asigurat de
folosirea procedurilor stocate, are i o alt soluie alternativ oferit de existen
unui parametru opional (neutilizat n exemplificrile anterioare) n cadrul funciei
OCIExecute [20] :
OCIExecute($identificator_Oci_Parse [, $mod])
Parametrul opional $mod poate s ia valori predefinite de genul:
-OCI_COMMIT_ON_SUCCESS - dup fiecare comand SQL (trimis spre
sever cu OCIExecute) se face COMMIT (aciune implicit, chiar prin lipsa
parametrului)
-OCI_NO_AUTO_COMMIT folosit pentru modul tranzacional de operare:
la ieirea din script, nu se salveaz nici o modificare n baza de date (ROLLBACK
implicit), dac anterior nu s-a executat o comand OCI_commit explicit.
n contextul anterior precizat, validarea sau anularea explicit a unei
tranzacii Oracle se poate face folosind funciile PHP OCI_commit sau
OCI_rollback.
Pentru o nelegere a modului de operare cu acest parametru, se consider o
exemplificare concret viznd un comportament tranzacional i avnd codul
urmtor:
<?php
$connection = OCILogon("student", "student","orcl");
$var = OCIParse($connection, "insert into angajati values (2, dan, 1000)");
OCIExecute($var, OCI_NO_AUTO_COMMIT) or die (error 1);
$var = OCIParse($connection, "insert into angajati values (3, dan, 1000)");
OCIExecute($var, OCI_NO_AUTO_COMMIT) or die (error 2);
$var = OCIParse($connection, "insert into angajati values ($id, $nume, $salar)");
OCIExecute($var, OCI_NO_AUTO_COMMIT) or die (error 3);
OCI_COMMIT($connection );
OCIFreeStatement($var);
OCILogoff($connection);
?>
Se poate observa c scriptul ncearc execuia succesiv a trei comenzi
INSERT, scopul acestuia fiind fie executarea tuturor, fie a nici uneia. Astfel:

108 PHP - 2
- dac toate cele trei comenzi se ncheie cu succes (deci nu se execut nici o
comand die care conduce la ieirea din script i implicit, prin folosirea parametrului
OCI_NO_AUTO_COMMIT, la invalidarea oricrei modificri n baza de date), prin
comanda de finalizare a tranzaciei OCI_COMMIT noile date sunt salvate n baza de
date (COMMIT pe toate comenzile);
- dac una dintre comenzi eueaz (chiar dac altele anterioare au reuit), o
comand die de prsire a scriptului este executat (ne mai ajungndu-se la
execuia comenzii OCI_COMMIT) i toate eventualele modificri ale bazei de date
efectuate prin apelul scriptului sunt anulate (ROLLBACK pe toate comenzile).
Utilizarea uneia sau alteia dintre soluiile propuse rmne la latitudinea
programatorului.

2.5.3. Interogare cu parametri pasai prin auto-apelare


Exemplul urmtor, coninnd o interogare parametrizat, se caracterizeaz
prin aceea c, att formularul de furnizare a parametrilor, ct i partea de preluare
a acestora i realizare a interogrii, sunt incluse ntr-un acelai script (autoapelare). Practic, la un prim apel al scriptului se execut doar o parte a acestuia,
constnd ntr-un formular (FORM fig. 2.21) pentru preluarea/furnizarea unor valori
de parametri. Prin apsarea butonului din formular, se realizeaz o auto-apelare a
aceluiai script spre care este pasat i un parametru, i va fi executat o alt parte a
scriptului (interogarea efectiv). Aceste decizii sunt luate printr-o structur PHP ifelse, ale crei seciuni pot include att cod HTML n clar, ct i cod PHP ncuibat
(fiierul avnd n mod obligatoriu extensia .php). O astfel de structur are forma
urmtoare:
<?php
if ( condiie ) {
?>
cod HTML i/sau PHP (ncuibat, ncadrat n delimitatori)
<?php
}
else
{
?>
cod HTML i/sau PHP (ncuibat, ncadrat n delimitatori)
<?php
}
?>
Codul surs complet al unui script exemplificativ (cu auto-apelare) este
urmtorul:
<?php
// Secvena care se execut la primul apel al scriptului,
// situaie n care NU a fost nc transmis nc nici un parametru
// de la formular
if (!isset($_GET[nume])){
// setat i nenul
?>
<center>
<form action="<?php $PHP_SELF ?>" method="get">
Nume: <input type="text" name="nume">

2.5. Dezvoltare de aplicaii PHP cu baze de date Oracle

109

<input type="submit" value="GO" />


</form>
</center>
<?php
}
// Secvena care se execut dup furnizarea unui parametru de interogare
// (autoapelare)
else{
?>
<table border="4" align=center>
<tr>
<th>ID</th>
<th>NUME</th>
<th>SALAR</th>
</tr>
<?php
$numePreluat=$_GET[nume];
$connection = OCILogon("system","manager100", "orcl");
print ("Connected successfully");
$stmt
=
OCIParse($connection,
NUME=$numePreluat");
OCIExecute($stmt);

"SELECT

FROM

angajati

where

while(OCIFetch($stmt)) {
$id= OCIResult($stmt, "ID");
$nume= OCIResult($stmt, "NUME");
$salar= OCIResult($stmt, "SALAR");
print (" <tr>\n".
" <td>$id</td>\n".
" <td>$nume</td>\n".
" <td>$salar</td>\n".
" </tr>\n");
}
?>
</table>
<?php
OCIFreeStatement($stmt);
OCILogoff($connection);
}
?>
n cadrul script-ului de mai sus se putea utiliza, ca i variant alternativ, o
structur if-else-end if de forma urmtoare, oarecum similar cu cea anterioar:
<?php if ( condiie ): ?>
cod HTML i/sau PHP (ncuibat, ncadrat n delimitatori)
<?php else: ?>
cod HTML i/sau PHP (ncuibat, ncadrat n delimitatori)
<?php endif; ?>

110 PHP - 2

Fig. 2.21. Formular interogare (apel fr parametrii)

De remarcat utilizarea n cadrul FORM-ului a unei variabile PHP speciale


($PHP_SELF), care furnizeaz o hyper-legatur (link) spre scriptul care conine acest
cod (practic un auto-apel cu transferul unui parametru, lucru observabil i n linia de
comand a browser-ului - fig. 2.21). Figura 2.22 prezint rezultatul aplicaiei
(implementat n maniera cu auto-apelare).
Observaie: Sintaxa action=<?php $_PHP_SELF ?> din cadrul scriptului
anterior poate fi nlocuit cu sintaxa action= sau action=nume_script.php,
unde nume_script.php reprezint numele scriptului curent, care se auto-apeleaz.
De remarcat de asemenea, funcia isset() care determin dac unei variabile
i s-a atribuit o valoare (a fost setat, deci nenul). n caz afirmativ, funcia
returneaz valoarea logic TRUE, altfel returneaz valoarea FALSE.

Fig. 2.22. Rezultate interogare (auto-apel cu parametri)

2.5. Dezvoltare de aplicaii PHP cu baze de date Oracle

111

Exemplul anterior arat c, att partea de cod specific introducerii de la


tastatur a parametrilor, ct i cea de preluare i utilizare a lor n interogarea SQL
efectiv, pot coexista n cadrul unui aceluiai script PHP, acesta practic putndu-se
auto-apela n mod repetat, reacionnd de fiecare dat n mod diferit funcie de
contextul auto-apelului.
Observaie: Spre deosebire de funcia isset (care returneaz TRUE pentru o variabil
cu o valoare setat i nenul), funcia empty returneaz FALSE dac variabila
testat are o valoare i acesta nu este 0 (zero). Din acest motiv, n exemplul
anterior, isset nu putea fi substituit de empty. Funcia empty returneaz TRUE
pentru string-uri vide ("","0"), 0 (zero numeric), NULL, FALSE, ir vid, respectiv
variabil declarat i neiniializat (caz specific programrii pe obiecte).

2.6. Dezvoltare de aplicaii PHP cu baze de date Interbase


Pentru operarea cu baze de date Interbase (sistem de gestiune al bazelor de
date produs de firma Borland), este necesar utilizarea ca extensie a bibliotecii
php_interbase.dll. Aplicaia urmtoare face o simpl exemplificare, avnd drept scop
principal, relevarea faptului c, indiferent de tipul de baze de date utilizat, modul de
abordare al problemei este relativ identic. Diferenele majore (excluznd evident
utilizarea unor funcii specifice fiecrui tip de baz de date) const n modul n care
se face conexiunea la serverul SQL, respectiv n modul n care sunt referii
parametrii de interogare n cadrul comenzilor SQL apelate. Aplicaia de fa
presupune adugarea unei noi linii ntr-o tabel Interbase, respectiv cutarea
acestei noi linii i afiarea sa pe ecran. Se consider tabela Interbase table1 creat
cu comanda:
CREATE TABLE table1 (nr INT, nume CHAR(10), virsta INTEGER, localitate
CHAR(10));
i n acest caz este necesar existena unui fiier HTML pentru transmiterea
spre scriptul PHP propriu-zis a valorilor corespunztoare articolului care va fi
adugat n tabel. Nu se mai face o prezentare a acestuia, fiind similar cu cel din
paragraful 2.4.3 (practic un formular pentru transmiterea parametrilor de intrare
spre scriptul PHP). Acest fiier HTML permite transmiterea a patru parametrii (nr,
nume, virsta, localitate - cu valori introduse de la tastatura) necesari adugrii unei
noi linii (complete) n tabela bazei de date.
Scriptul PHP spre care sunt transmise valorile acestor parametri i care va
realiza adugarea propriu-zis n tabela bazei de date este urmtorul:
<?php
// Conectare la server Interbase si deschide baza de date
$dbh= ibase_connect(localhost:c:\datafile\test.gdb,
sysdba, masterkey);
// Operaie de adugare cu parametrii
$query =ibase_query($dbh,"INSERT INTO TABLE1 (nr,nume,virsta,localitate)
VALUES (?,?,?,?)",$nr, $nume, $virsta,$localitate);
Echo "<strong>Adaugare reusita!";
// Selectarea i afiarea doar a nregistrrii adugate
$query =ibase_query($dbh,"SELECT * FROM TABLE1 where nr=?", $NR);

112 PHP - 2
print(<table BORDER="1" align=center >);
$coln=ibase_num_fields($query);
print (" <tr>\n");

//nr. de cimpuri

// realizare automat a capului de tabel (coninnd toate cmpurile)


for ($i=0; $i<$coln; $i++){
//ir (array) cu informaii despre cmpuri
$col_inf=ibase_field_info($query,$i);
//numele cmpurilor ca i cap de tabel
echo "<th BGCOLOR=Silver>$col_inf[0]</th>";
// Atenie - greit: echo<th GCOLOR="Silver">$col_inf[0]</th>
print (" </tr>\n");
while ($row = ibase_fetch_row($query)) {
echo" <tr>\n";
foreach ($row as $value) {
//Afiare nregistrare adugata
echo "<td BGCOLOR=Cyan> $value</td>";
}
echo "</tr>";
}
}
ibase_close ($dbh);
?>
Rezultatul pe ecran este similar cu cel din fig. 2.10.
Scriptul poate fi modificat echivalent (cu acelai rezultat) astfel:
n locul compactei comenzi ibase_query($dbh,"INSERT se poate folosi o
secven echivalent de genul:
//pregtirea unei interogri cu parametrii (util mai ales dac se repet,
dar cu
// ali parametrii de intrare)
// comanda INSERT n aceast sintax se refer la toate cmpurile tabelei
$query =ibase_prepare(INSERT INTO TABLE1 VALUES (?,?,?,?));
// executarea adugrii (prin transferul parametrilor)
ibase_execute($query,$NR,$nume,$virsta,$localitate);
ibase_free_query($query);
// eliberare resurse (nu este obligatorie)
ibase_free_result($sth);
//nu este obligatorie
Se poate remarca, comparativ cu situaiile operrii cu MySQL, respectiv
Oracle, c deosebirile substaniale apar legat de conexiunea la serverul SQL (stringul de conectare), respectiv deschiderea bazei de date, precum i la modul de
integrare a parametrilor de intrare n cadrul string-ului de interogare (comanda
SQL). n rest, lucrurile sunt aproape similare, din acest motiv ne mai insistndu-se
asupra operrii cu alte tipuri de servere de baze de date.

2.6. Dezvoltare de aplicaii PHP cu baze de date Interbase 113


Observaie: Se menioneaz c, kit-ul de distribuie PHP vine nsoit de un pachet
suplimentar (a crui eventual instalare se face explicit, ulterior instalrii de baz),
numit PEAR (PHP Extension and Application Repository), constnd practic ntr-un
depozit/colecie de componente software reutilizabile (open-source). n cadrul
acestuia, o component (PEAR:DB) se refer la operarea cu baze de date,
asigurnd un strat suplimentar de abstractizare, care conduce astfel la o cretere a
portabilitii codul din punct de vedere al multitudinii de tipuri de baze de date.
Pachetul PEAR:DB ofer un API (Application Programming Interface) unificat pentru
gestionarea diverselor tipuri de baze de date, principalele avantaje ale folosirii lui
fiind simplitatea codului i portabilitatea lui, fiind recomandat folosirea lui n cadrul
unor aplicaii care implic o mare diversitate de tipuri de baze de date.

2.7. Grafic
PHP-ul dispune un set de funcii extrem de puternice pentru crearea i
manipularea elementelor de grafic i a imaginilor, oferind astfel utilizatorului
faciliti deosebite i n domeniul graficii (2d).
Realizarea unor aplicaii grafice cu PHP implic utilizarea unor biblioteci
suplimentare (fiiere .dll). [1][20] Astfel, n cazul de fa, s-a utilizat biblioteca
PHP_GD2.DLL configurnd corespunztor fiierul php.ini (extension= php_gd2.dll).
De regul, formatul imaginilor manipulate (jpg, gif, png etc) depinde de versiunea
bibliotecii grafice suplimentar utilizate
n cele ce urmeaz, fr a detalia toate cele cteva zeci de funcii dedicate
crerii i manipulrii imaginilor, respectiv a elementelor specifice graficii, se va
realiza o trecere n revist a doar ctorva dintre ele, prin exemplificarea a dou
aplicaii.
O prim aplicaie face apel la cteva funcii privind crearea /manipularea
unei imagini .jpg. Codul complet este prezentat n continuare, iar efectul rulrii
acestui script este descris n figura 2.23 [1]:
<?php
// Anterior: setare ca fiier extensie activ (n php.ini): php_gd.dll
// Creare imagine nou
$im = ImageCreate (500, 100) or die (Cannot Initialize new GD image stream);
// deschiderea unei imagini existente
//
$im = ImageCreateFromJPEG(leopard.jpg)
//
or die (Cannot Initialize new GD image stream);
// linia urmtoare nu-i are sensul pentru o imagine surs dat
$background_color=ImageColorAllocate($im,1,255,25);
$text_color = ImageColorAllocate ($im, 230, 14, 191);
//ImageString dimensiunea scrisului,- poziia pe orizontal (pixeli),
poziia
//pe vertical (pixeli)
ImageString($im,10,100,35, A Simple Text String, $text_color);
// Salvare imagine prelucrat sau creat i afiare
ImageJpeg ($im,tinta.jpg);
echo <img src=tinta.jpg >;

114 PHP - 2
// Creare unei FUNCII care va fi apelat
function LoadJpeg($imagine, $text)
{
$im1 = ImageCreateFromJPEG($imagine)
or die (Cannot Initialize new GD image stream);
$text_color = ImageColorAllocate ($im1, 23, 14, 191);
ImageString ($im1, 10, 10, 35, $text, $text_color);
ImageJpeg ($im1,a.jpg);
echo <img src=a.jpg >;
}
// Apel funcie
LoadJpeg(leopard.jpg,Ceva de afisat);
?>

Fig. 2.23 Crearea i afiarea a dou imagini

Practic, n cadrul exemplului prezentat sunt create i afiate dou imagini,


peste fiecare fiind suprascris un text (ir de caractere).
Prima imagine este creat cu un fundal verde, fr a porni de la o surs
iniial, iar a doua imagine este creat pornind de la un fiier imagine jpeg ca surs.
Ambele imagini astfel create sunt salvate, iar afiarea lor se face utiliznd eticheta
HTML <img>. Cea de-a doua imagine a fost creat pe baza apelului unei funcii,
necesitnd ca parametrii iniiali fiierul surs jpeg, respectiv textul de afiat.
O a doua aplicaie, puin mai complex, permite realizarea graficului scalat al
unei funcii matematice oarecare. Codul surs comentat este redat n continuare, iar
efectul script este prezentat n figura 2.24.
<?php
//definire constante (dimensiuni axe)
define(xmax,500);
define(ymax,200);
//creare imagine (lime, nlime)
$im=ImageCreate (xmax, ymax)or die (Cannot Initialize new GD image stream);
//fundal imagine (rgb-galben)
$background_color = ImageColorAllocate ($im, 255, 255, 0);

2.7. Grafica

115

//culoare axe (verde)


$axe=ImageColorAllocate ($im, 0, 255, 0);
//culoare text (negru)
$text_color = ImageColorAllocate ($im, 0, 0, 0);
//titlu grafic (font, x, y)
ImageString ($im, 5, 200, 10, Grafic test, $text_color);
//trasare axe ($axe -culoare)
imageline($im,0,100,500,100,$axe);
imageline($im,0,0,0,200,$axe);
//afiare text pe axe (orizontal, vertical)
ImageString($im, 4, 425, 104, timp [s], $text_color);
ImageStringup($im, 4, 4, 25, val, $text_color);
//culoare histograme (albastru)
$abc=imagecolorallocate($im,255,0,0);
//culoare grafic (albastru)
$grafic=imagecolorallocate($im,0,0,255);
//histograme (dreptunghiuri)
imagefilledrectangle($im,200,100,220,140,$abc);
imagefilledrectangle($im,300,50,320,100,$abc);
// coordonate iniiale
$x0=0;
$y0=0;
// calcul coordonate grafic i afiare grafic
for($x=0;$x<500;$x+=1)
{
// generare numr aleator ntreg ntr-un interval prestabilit
$a=rand(-30,30);
// calcularea succesiv a coordonatei y a funciei
$y=(2*sin($x)+log($x*10+10))*15-100+$a;
//trasare grafic linie cu linie
if ($x0!=0)
imageline($im,$x0,ymax/2-$y0,$x,ymax/2-$y,$grafic);
$x0=$x;
$y0=$y;
}
//salvare imagine ntr-un fiier i afiare
ImageJpeg ($im,tinta.jpg);
echo <img src=tinta.jpg >;
?>
Analiznd aplicaia, se poate observa parcurgerea urmtoarelor etape:
crearea
imaginilor
i
stabilirea
culorii
fundalului
(ImageCreate,
ImageColorAllocate);
- stabilirea culori axelor i a textului (ImageColorAllocate);
- afiarea titlului, trasare axe, scriere text pe axe (ImageString, ImageLine);
- realizarea unor histograme (exemplificative, fr legtur cu graficul funciei:
ImageFilledRectangle);
- stabilirea culorii graficului (ImageColorAllocate);

116 PHP - 2
- calculul funcie i afiarea prin linii succesive (For, ImageLine);
- salvare i afiare imagine grafic (ImageJpeg, <img>).

Fig. 2.24. Graficul unei funcii matematice

Observaie: Pentru afiarea imaginii graficului, fr o salvare prealabil ntr-un fiier


a acesteia, se poate utiliza n finalul script-ului o secven de genul:
// setarea tipului coninutului (MIME)
header(Content-type: image/jpeg);
// afiare imagine
@imagejpeg($im);
//caracterul @ care prefixeaz o funcie, face ca mesajele de eroare aferente
execuiei acelei funcii s nu fie afiate de browser; eventualele mesaje de eroare
pot fi consultate prin analiza coninutului variabilei globale $php_errormsg.
Exemplele prezentate arat c PHP-ul dispune de puternice faciliti grafice,
permind o manipulare i prelucrare facil a imaginilor, generarea dinamic a
acestora, precum i salvarea lor n cteva formate standard.
Rezumnd, o scurt selecie a celor mai uzuale funcii utilizabile pentru
dezvoltarea unor aplicaii de grafic utiliznd PHP este prezent n continuare
(fiecare funcie fiind precedatde tipul returnat):
- int ImageCreate( ) creeaz o imagine cu dimensiuni precizate, returnnd
un identificator de imagine de tip ntreg;
- int ImageCreateFromJpeg( ) creeaz o imagine pornind de la un fiier de
tip JPEG (returneaz un identificator ntreg n caz de succes sau 0 n caz de eec).
Pentru alte tipuri de fiiere imagine: ImageCreateFromGif(),
ImageCreateFromPng().
- int ImageColorAllocate( ) creeaz un identificator de culoare pentru o
imagine, pe baza paletei RGB, culoare care poate fi alocat fundalului, unui text
etc.;

2.7. Grafica

117

- int ImageString( ) insereaz un ir de caractere de o anumit


dimensiune n cadrul imaginii, pe orizontal, la coordonatele precizate. Identic,
ImageStringUp( ) pentru scriere pe vertical;.
- int ImageJPEG( ) afieaz imaginea desemnat printr-un identificator,
sau o salveaz ntr-un fiier specificat n format JPEG (idem pentru formatele GIF,
PNG).
- int ImageLine( ) afieaz un segment de dreapt identificat de
coordonatele a dou puncte, cu o anumit coloare (ImageDashedLine( ) pentru linii
ntrerupte);
- int ImageRectangle( ) deseneaz o forma rectangular;
- int ImagePolygon( ) deseneaz un poligon (coordonatele precizate
printr-un ir);
- int ImageArc( ) deseneaz un arc de cerc;
- int ImageSetPixel( ) deseneaz un pixel de o anumit culoare, la
anumite coordonate;
- int ImageFilledRectangle( ) umple cu o anumit culoare o zon
rectangular (identic pentru o zon poligonal: ImageFilledPolygon( )) ;
- int ImageDestroy( ) distruge un identificator de imagine i elibereaz
memoria alocat acestuia.

2.8. Funcii pentru operare cu fiiere


PHP-ul dispune de un puternic set de funcii dedicat operaiilor de
intrare/ieire cu fiiere: creare/tergere de fiiere, citire/scriere/adugare n fiiere
(att pentru fiiere n format text, ct i pentru format binar). Exemplul urmtor,
implementnd practic un contor al acceselor realizate de ctre clieni la scriptul n
cauz, ncearc o exemplificare a doar cteva dintre aceste funcii, considerate ca
fiind mai importante.
<?php
// Declarare nume pentru fiier
$filename = counter.nr;
// Deschidere fiier doar pentru citire (avertisment, dac nu exist)
// @fopen- pentru inhibare avertisment
$fp = fopen($filename,r) or die(Eroare);
// Determinare dimensiune fiier doar pentru exemplificare!
// Probleme cu fiiere mai mari de 2 GB
echo filesize($filename);
// Citire din fiier (se citesc 26 bytes)- citire contor existent
$hits = fread($fp,26);
// Incrementare contor
// cu forare la tip ntreg, necesar fr o valoare 0 iniial n fiier
$hits = (int)$hits+1;
// nchidere fiier
fclose($fp);
// Deschidere fiier doar pentru scriere
$fp = fopen($filename,w);

118 PHP - 2
// Scrie n fiier (suprascriere) sau fputs($theFile, $hits);
$a=fwrite($fp,$hits,26);
echo <p> Sunteti vizitatorul cu numarul ;
echo $hits; ?>
Aplicaia ncepe prin precizarea unui nume pentru fiierul (de tip text) care
va memora contorul de accese (practic un numr ntreg, incrementat dup fiecare
acces). n exemplul de fa, numele ales pentru acest fiier este counter.nr
($filename=counter.nr;).
n cazul n care localizarea fiierului nu este implicit n directorul curent,
este necesar precizarea cii complete de localizare a fiierului. Spre exemplu:
$filename=http://localhost/scripts/test/counter.nr;
//sau
$filename =c:\\text\\counter.nr;
Urmeaz apoi deschiderea pentru citire a acestui fiier, utiliznd funcia
fopen(). Fiierul trebuie s fie creat anterior, n caz contrar (adic fiierul nu exist)
operaia terminndu-se printr-un avertisment (warning). Deja s-a fcut apel la o
prim funcie de lucru cu fiiere, cu sintaxa uzual:
int fopen (string filename, string mode);
Funcia returneaz un identificator de tip ntreg. Primul parametru al funciei
este un string reprezentnd numele fiierului care va fi deschis (putnd include i
calea spre acesta), iar al doilea parametru reprezint modul n care se face
deschiderea fiierului, putnd lua urmtoarele valori prezentate n tabelul urmtor:
Tabel 2.3.

r
r+
w
w+
a
a+

deschidere numai pentru citire, pointerul de fiier fiind plasat la


nceputul fiierului
deschidere pentru citire i scriere, pointerul de fiier fiind plasat la
nceputul fiierului
deschidere numai pentru scriere, pointerul de fiier fiind plasat la
nceputul fiierului, iar coninutul iniial al fiierului este ters; dac
fiierul nu exist este creat ca fiier nou
deschidere pentru citire i scriere, pointerul de fiier fiind plasat la
nceputul fiierului, iar coninutul iniial al fiierului este ters; dac
fiierul nu exist, se ncearc crearea lui
deschidere numai pentru scriere, pointerul de fiier fiind plasat la
sfritul fiierului (practic o operaie de adugare); dac fiierul nu
exist, se ncearc crearea lui
deschidere pentru citire i scriere, pointerul de fiier fiind plasat la
sfritul fiierului (practic o operaie de adugare); dac fiierul nu
exist, se ncearc crearea lui

Acest al doilea parametru poate include i valoarea b, util n cazul n care


se realizeaz operaii cu fiiere binare. Aceast valoare se utilizeaz n combinaie
cu cele precedente. Spre exemplu, wb semnific scriere ntr-un fiier n format
binar.
n continuarea programului se citete contorul existent ntr-o variabil. Se
utilizeaz n acest sens funcia fread() cu sintaxa:
string fread (int fp, int length)

2.8. Funcii pentru operarea cu fiiere

119

unde primul parametru reprezint identificatorul fiierului din care se citete, iar al
doilea parametru -numrul de bytes citii. n cazul de fa, numrul 26 s-a ales pur
aleator. Se observ c funcia returneaz chiar string-ul pe care l citete.
Se realizeaz apoi o incrementare a contorului (mai precis a coninutului
variabilei n care s-a memorat contorul citit din fiier). De remarcat modul n care se
foreaz la tip ntreg coninutul variabilei ((int)$hits)), operaie care permite
startarea procesului de contorizare fr ca n fiierul creat s existe o valoare iniial
(zero). Dac se dorete o forare la tipul float, se utilizeaz o construcie de forma
(float)$variabila.
Urmeaz nchiderea fiierului: fclose($fp)(acesta fiind deschis iniial doar
pentru citire). n acest moment se dispune (ntr-o variabil) de numrul de accesri
ale paginii curente. Ceea ce mai rmne de fcut este o actualizare a contorului i n
fiierul n care acesta este pstrat i eventual, o afiare a acestuia pe ecran. Pentru
aceasta, este necesar o redeschidere a fiierului, dar de data asta, pentru o
operaie de scriere (mai precis, o operaie de suprascriere):
$fp = fopen($filename,w);
Se scrie variabila contor actualizat n fiier, utiliznd funcia fwrite() cu
sintaxa urmtoare:
int fwrite (int fp, string string [,int length])
Primul parametru al funciei reprezint identificatorul fiierului n care se va
face scrierea, al doilea parametru irul de caractere scris, iar ultimul parametru
(opional) numrul de bytes scrii (dac acest numr este mai mare dect lungimea
string-ului de scris, scrierea se oprete cnd se ajunge la finalul string-ului, caz
implicit n lipsa parametrului opional). n locul funciei fwrite() se putea folosi
funcia fputs(), cu aceeai parametrii i cu o aciune identic. n finalul scriptului s-a
fcut i o afiare pe ecran a numrului de accese la pagina curent.
n exemplul prezentat s-a realizat o suprascriere a coninutului fiierului la
fiecare accesare a scriptului. Secvena urmtoare prezint o operaie de adugare a
unui text ntr-un fiier, pe un rnd nou (simbolul \n), rndurile fiind separate ntre
ele printr-o linie liber:
// deschidere pentru scriere (adugare)
$fp = fopen($filename1,a+);
// adugare cu cte un rnd gol
fwrite($fp,\n adaugat\n,20);
O situaie des ntlnit este cea n care sunt generate fiiere n format PDF
(fig.2.25), ca alternativ pentru stocarea i/sau tiprirea n formate predefinite a
unor date.
Crearea unui fiier PDF implic utilizarea bibliotecii extensie php_pdf.dll,
acesta trebuind a fi activat (prin setarea corespunztoare n fiierul php.ini). [20]
Exist i alte soluii n acest sens, implicnd utilizarea altor biblioteci externe, chiar
mai performante, dar cea bazat pe extensia implicit oferit de PHP, fiind i cea mai
la ndemn, este considerat n continuare pentru o scurt exemplificare. Codul
urmtor (cu comentariile corespunztoare explicrii comenzilor folosite i aciunilor
efectuate) prezint modul n care se creeaz un document PDF avnd dou pagini
(soluia putnd fi generalizat pentru oricte pagini). Sunt punctate, prin
comentariile aferente, cteva elemente de baz viznd setarea paginii, poziionarea
informaiei n pagin, formatarea textului, grafic, inserarea de imagini:

120 PHP - 2

Fig.2.25. Coninut fiier PDF generat (cu dou pagini)

<?php
// creare identificator fiier
$mypdf = PDF_new();
// creare fiier PDF i deschidere cu precizare locaie
// dac fiierul exist, este suprascris
PDF_open_file($mypdf, "c:\wamp\www\pdf\gen01.pdf");
// creare pagina 1 cu setare dimensiuni
PDF_begin_page($mypdf, 595, 842);
// cutare font text
$myfont= PDF_findfont($mypdf, "Times-Roman", "host", 0);
// setare font text
PDF_setfont($mypdf, $myfont, 22);
//scriere text
cu fontul setat i la locaia precizat
PDF_show_xy($mypdf, "Text exemplu n fisier.", 50, 750);
PDF_show_xy($mypdf, "Creat cu PHP.", 50, 730);
// ncrcare imagine (preciznd sursa i tipul imaginii)
$myimage = PDF_load_image($mypdf,"gif", "c:\wamp\www\pdf\logo_i.gif", "");
// inserare imagine (preciznd locaia n pagin i scara dimensional)
PDF_place_image($mypdf, $myimage, 150, 600, 1.0);
// trasare linie (setare grosime, punct start, punct final)
pdf_setlinewidth($mypdf, 10);
PDF_moveto($mypdf, 150, 550);
PDF_lineto($mypdf, 450, 550);
pdf_stroke($mypdf);
PDF_end_page($mypdf);

// trasare linie anterior definit


// sfrit pagina 1

// generarea celei de-a doua pagini


PDF_begin_page($mypdf, 595, 842);
$myfont= PDF_findfont($mypdf, "Times-Roman", "host", 0);

2.8. Funcii pentru operarea cu fiiere

121

PDF_setfont($mypdf, $myfont, 16);


PDF_show_xy($mypdf, "Made with the PDF libraries for PHP.", 50, 730);
PDF_end_page($mypdf);
PDF_close($mypdf);
// nchidere fiier (obligatoriu)
PDF_delete($mypdf);
// tergere identificator fiier
echo "Fisier PDF creat!"; // mesaj confirmare n pagina Web
?>
Fiierul PDF creat are dou pagini, fiind prezentat n fig.2.25.

2.9. Operare cu sesiuni


Crearea unei sesiuni (numit i sesiune client) este asigurat de ctre
limbajul PHP prin utilizarea n cadrul unui script a aa numitului mecanism
SESSION, startat (spre exemplu) printr-o linie de program de forma:
session_register ("global");
Ce nseamn modul de lucru sesiune i care este utilitatea lui? Dou
ntrebri eseniale, la care se va ncerca un rspuns n continuare. n momentul
executrii liniei de cod session_register("global"), interpretorul PHP starteaz o
sesiune de lucru valabil, doar pentru clientul Web curent, att timp ct acesta nu
nchide browser-ul (din care a apelat respectivul script coninnd aceast linie de
cod) sau avnd o durat de via n conformitate cu setrile interpretorului PHP
privind valabilitatea unei sesiuni. [15] Fizic, startarea unei sesiuni nsemn crearea
unui fiier sesiune salvat pe server (implicit n directorul PHP\SESSIONDATA sau
WAMP\TMP), cu un nume aleator, unic, cte unul pentru fiecare sesiune pornit.
Spre exemplificare, numele fiierului sesiune poate fi de forma:
sess_1b308801f20323d7713880f389f2489e
n cadrul comenzii session_register, parametrul cu numele global (ales
pentru exemplificare) este practic o variabil (sau ir, tablou etc.) ale crei/crui
valori (iniializate prin comenzi PHP uzuale) sunt vizibile i deci apelabile / utilizabile
n orice alt script referit de browser pe parcursul sesiunii de lucru. Cu alte cuvinte,
coninutul acestei variabile (de regul ir sau tablou mono-dimensional sau
bidimensional) devine public pentru orice script apelat pe parcursul duratei de via
a sesiunii, cu condiia ca fiecare un astfel de script al site-ului s conin, obligatoriu
la nceputul lui, linia de cod session_register("global").
O sesiune de lucru se ncheie n momentul nchiderii browser-ului sau
explicit prin cod program (comanda session_destroy). La oprirea browser-ului,
datele din fiierul sesiune rmn stocate n acesta, iar o ncheiere prin cod program
a sesiunii conduce la tergerea fiierul sesiune. Se asemenea, nchiderea sesiuni se
poate face i automat, la expirarea duratei ei de via prevzut prin setrile interne
PHP. Fiierul php.ini conine variabila session.gc_maxlifetime avnd o valoare
predefinit exprimnd, n secunde,
durata de via a unei sesiuni (implicit
session.gc_maxlifetime=1440).
Utilizarea sesiunilor este util (uneori chiar obligatorie) n mai multe situaii,
enumerndu-se aici doar cteva:
- transferul/ pasarea unor valori de parametri prin/spre toate paginile unei
aplicaii Web (coninnd o multitudine de pagini), aceste valori fiind vizibile i

122 PHP - 2
accesibile din orice pagin a site-ului (cazul implementrii unui co virtual de
cumprturi specific aplicaiilor Web gen magazin on-line);
- asigurarea accesul securizat (parolat) la paginile unui site Web, printr-un
transfer i purtare a parolei de acces prin fiecare pagin securizat, accesat de
clientul vizitator;
- diverse situaii impunnd expirarea valabilitii unor date (folosind
mecanismul de nchidere temporizat a unei sesiuni).
Mecanismul de operare cu sesiuni permite transferarea sigur, comod i
aproape implicit (necesitnd doar o linie de cod, repetat n fiecare script al siteului) a unui numr practic nelimitat de parametri ntre o mulime de pagini Web
(care constituie un site unitar).
Exemplu: Fie urmtoarele dou fiiere script PHP, prezentate n tabelul 2.3.
Primul script starteaz o sesiune, crendu-se un fiier sesiune cu numele specificat,
n care se va memora coninutul unei variabile $var (atribuit explicit ulterior startarii
sesiunii n cadrul scriptului). n acest moment, fiierul sesiune va conine (vezi
tabelul 2.4): numele variabilei (var), tipul i lungimea coninutului (s:4) string 4 -,
precum i coninut efectiv: string-ul ceva.
n scriptul a.php este prevzut un hyperlink ctre un al doilea script b.php,
n
care,
sesiunea
curent
fiind
n
continuare
activ
(comanda
session_register("var")), se asigur disponibilitatea coninutului variabile $var (care
este i afiat pe ecran).
Tabel 2.4.

Script a.php
<?php
session_register("var");
$var="ceva";
echo "<a href=b.php>mai departe";
?>

Script b.php
<?php
session_register("var");
echo $var;
echo "<a href=a.php>back";
session_destroy();
?>

Nume fiier sesiune:


sess_1b308801f20323d7713880f389f2489e
Coninutul fiierului sesiune:
var|s:4:"ceva";
La finalul scriptului b.php sesiunea este distrus, fiierul sesiune fiind ters
prin utilizarea comenzii session_destroy(). De asemenea, n al doilea script este
prevzut un hyperlink de revenire spre scriptul apelant (a.php), care restarteaz
aceeai sesiune (crend un fiier sesiune cu acelai nume) i ntreg procesul se reia
nc o dat. Cu alte cuvinte, cele dou scripturi implementeaz o bucl repetitiv de
(re)creare/distrugere succesiv a unei sesiuni.
Meninerea disponibilitii i accesabilitii unor informaii (date utile) pe
toata durata navigrii prin mai multe pagini Web constituind o aplicaie unitar (n
diverse scopuri particularizate la specificul aplicaiei) constituie principalul beneficiu
conferit de lucrul cu sesiuni.
Observaie: Transferul de parametrii de la un script spre altul, n vederea asigurrii
disponibilitii acelor parametrii n mai multe pagini Web, se poate realiza i
utiliznd casete de tip INPUT cu atributul type=hidden. Metoda este eficient atunci
cnd trebuie transferat un numr fix, redus, de parametri, dar devine greoaie atunci
cnd numrul parametrilor de transferat crete.

2.9. Operare cu sesiuni (session) 123


O alt tehnic de lucru cu sesiuni, care se poate folosi n versiunile mai noi
de PHP (ulterioare versiunii 4.0), implic utilizarea unor variabile de tip
$_SESSION[]. Tehnica ofer un nivel mai ridicat de siguran al aplicaiei (similar cu
cazul folosirii pentru transferul parametrilor a construciilor de genul $_GET[ ],
respectiv $_POST[ ]), fiind cea mai recomandat.
Un posibil scenariu de folosire a acestei tehnici presupune urmtoarele:
- Pentru deschiderea unei noi sesiuni PHP, scriptul trebuie s nceap cu
apelarea funciei session_start(). Aceasta funcie verific, mai nti, dac exist un
identificator (ID) de sesiune. Dac nu exist, se va crea unul, i astfel se va
deschide o nou sesiune. Dac exist, atunci funcia ncarc variabilele sesiune
sesiunii client curente stocate pe server, ele fiind astfel pregtite pentru utilizare.
Atunci cnd se lucreaz cu sesiuni, aceasta funcie (session_start) trebuie apelat la
nceputul tuturor scripturilor care folosesc sesiunea n cauz.
- Variabilele de sesiune sunt stocate n tabloul superglobal numit
$_SESSION[],
(n
versiunile
mai
vechi
de
PHP
fiind
numit
$HTTP_SESSION_VARS[]).
- Variabilele sesiune sunt disponibile i pot fi folosite pn la tergerea lor
voluntar sau pn la ncheierea sesiunii.
- Pentru a crea o variabil de sesiune trebuie s se introduc un element n
tabloul $_SESSION[]: $_SESSION[variabila_noua]=10;
- Pentru a verifica dac o anumit variabil este nregistrat ca variabil de
sesiune n acest tablou, se folosete functia isset() returnnd o valoare boolean
true sau false, ca n exemplul urmtor: if ( isset($_SESSION[variabila_noua]) )...
n funcie de valoarea logic a condiiei impuse cu funcia isset(), execuia
programului urmeaz o cale sau alt.
Pentru exemplificare, se prezint o rescriere a scripturilor anterioare,
utiliznd aceast a doua tehnic de operare cu sesiuni (tabel 2.5):
Tabel 2.5.

Script a.php
<?php
session_start();
$_SESSION[var]="ceva";
echo "<a href=b.php>mai departe";
?>

Script b.php
<?php
session_start();
$var=$_SESSION[var];
echo $var;
session_destroy();
?>

tergerea selectiv a unei variabile sesiune (nu a tuturor variabilelor, deci nu


distrugerea sesiunii) se poate face folosind comanda unset (spre exemplu,
unset($_SESSION[var];).
Construcia $_SESSION[ ] poate folosi ca parametru de intrare nu doar
nume de variabile (vezi exemplele anterioare), ci i nume de iruri (array), situaie
frecvent n cazul necunoaterii apriorice a numrului de variabile sesiune. Spre
exemplificare:
Tabel 2.6.

Script a.php
<?php
session_start();
$_SESSION['var[1]']="ceva";
$_SESSION['var[2]']="ceva1";
echo "<a href='b.php'>mai departe";
?>

Script b.php
<?php
session_start();
echo $_SESSION['var[1]'];
echo $_SESSION['var[2]'];
session_destroy();
?>

124 PHP - 2
Ca o concluzie, o variabil sesiune este salvat ntr-o resurs de tip fiier
sesiune (de tip text) stocat pe partea de server Web, fiind vizibil n ntreaga
aplicaie Web (n toate scripturile PHP ale aplicaiei site). Pentru o variabil sesiune
denumit VAR, referirea n scriptul PHP se face sub forma $_SESSION[VAR],
respectiv $_SESSION[VAR[indice]] - dac este vorba despre un variabil array.

2.10. Operare cu cookies


Spre deosebire de o sesiune, un cookie permite salvarea unor informaii
posibil necesare i reaccesate repetat ori de cate ori se reapeleaz pagina
respectiv, salvarea lor fcndu-se ns pe partea de client (brower-ul trebuind
setat s accepte cookie).[15][19] Un exemplu des ntlnit este cel n care, un
utilizator dorete s salveze numele de user, respectiv parola de acces pe anumit
site Web astfel nct, la o reaccesare a acelui site, acestea s fie disponibile implicit,
fr a mai fi necesar reintroducerea lor explicit de la tastatur.
Comanda PHP pentru crearea unui cookie are urmtoarea sintax uzual
(doar trei dintre principalii parametri fiind referii aici):
setcookie (string $nume_cookie, string $valoare, int timp_expirare)
Cteva exemple de definire a unui cookie folosind aceti parametri:
- setare cookie cu nume USER, avnd o singur valoare ION i expirnd
dup 60 de secunde:
SetCookie ("USER", "Ion", time()+60);
- setare cookie cu numele securizare1, avnd valorile ION, respectiv
PAROLA123, doar a doua valoare expirnd dup 30 de secunde (prima valoare
neavnd timp de expirare):
setcookie("securizare1[user]", "ION");
setcookie("securizare1[parola]", "PAROLA123",time()+30);
- tergere cookie prin setarea unui moment de timp anterior (tergerea
explicit a fiecrei variabile cookie are loc dup 1 secund):
setcookie("securizare1[user]", "ION", , time()-1);
setcookie("securizare1[parola]", "PAROLA123",time()-1);
Accesul la o variabil cookie se realizeaz (oarecum similar ca la sesiuni)
printr-o construcie de genul:
$_COOKIE[nume], parametrul fiind numele cookie interpretabil ca variabil sau
array, dup caz.
Pornind de la secvenele anterioare, se prezint dou exemple de cod:
- primul, realiznd o setare a unui cookie cu dou variabile (definit ca ir cu
dou elemente), respectiv afiarea valorilor lor dac cookie-ul exist deja;
- al doilea, realiznd o tergere a cookie-ului (a ambelor valori, putndu-se
face i doar o tergere selectiv dup cum este cazul).
<?php
if (!isset($_COOKIE[securizare1]))
{
//echo "setez cookies: ";
setcookie("securizare1[user]", "ION" );
setcookie("securizare1[parola]", "PAROLA123",time()+30);
}
else

2.10. Operare cu cookies 125


{
echo "cookies setate:: ";
foreach ($_COOKIE[securizare1] as $value) {
$value=htmlspecialchars($value);
echo "$value <br />\n";
}
} ?>
Prima secven a codului anterior verific dac exist un cookie cu numele
securizare1, n caz contrar crend unul, coninnd dou variabile cu valorile lor
explicite (eventual cu timp de expirare). A doua secven detecteaz existena
cookie-ului, afind valorile variabilelor acesteia (tratarea fcndu-se ca n cazul
unui ir). Funcia htmlspecialchars este recomandat a fi folosit pentru tratarea
cazului folosirii unor caractere speciale (<,>, &, , etc.)
tergerea cookie-ului se face prin setarea unui moment de timp anterior de
expirare, (practic expirare ntr-o secund pentru exemplul urmtor). Exemplu:
<?php
setcookie("securizare1[user]", "ION", time()-1);
setcookie("securizare1[parola]", "PAROLA123",time()-1);
?>
Observaie: Dac se terge doar o variabil a cookie-ului, acesta rmne n
continuare definit/setat cu cealalt valoare, iar funcia isset va returna TRUE.

2.11. Transferuri de parametri


2.11.1. Selecii multiple
n capitolul anterior (HTML) au fost descrise cteva etichete HTML care
permit selecii multiple, acelai parametru putnd s fie transmis de ctre un
formular spre un script apelat cu mai multe valori simultan. n acest context, se
pune problema modului de preluare a acestor valori multiple de ctre un script PHP.
n principiu este vorba despre modul de interaciune cu PHP a etichetelor INPUT cu
atributul checkbox, respectiv SELECT.
Eticheta INPUT, cu atributul checkbox, permite selectarea (bifarea) sau nu a
uneia sau mai multor casete de selecie (crora li se ataeaz valori fixate,
predefinite). Problema este simpl n cazul n care o singur caset este bifat (sau
exist o singur caseta care poate fi selectat sau nu), variabilei cu numele precizat
de parametrul name atribuindu-se valoarea singular, fixat a parametrului value.
n cazul lipsei unei selecii, variabila cu numele dat de parametrul name este creat,
dar nu este setat, avnd practic o valoare vid. Spre exemplificare, se consider
scriptul urmtor care utilizeaz, ntr-un form, o astfel de caset de selecie INPUT
checkbox (fig.2.26).
<?php
echo "<form name=myform method=post action=a.php>";
echo "Selecteaza:<input type=checkbox name=check value=id >";
echo "<input type=SUBMIT value=Validez selectiile >";
echo "<form>"; ?>
Dac se utilizeaz i atributul checked, linia 3 a scriptului fiind de forma:
echo "Selecteaza:<input type=checkbox name=check value=id checked >";

126 PHP - 2
checkbox-ul este implicit selectat (bifat).
Formularul astfel construit, trimite - n caz de selecie (bifare) a casetei
checkbox - variabila $check=id (name=check, value=id) spre un alt script (a.php).
Scriptul urmtor arat modul n care poate fi verifucat rezultatul aciunii asupra unei
casete INPUT-checkbox (selecie sau neselectie). n script apare funcia empty care
permite o verificare practic a selectrii sau nu a casetei. Funcia empty testeaz
dac variabila transmis ca parametru nu are un coninut (returnnd TRUE pentru
neselecie, practic coninut vid, respectiv FALSE pentru selecie). Funcia isset va
returna TRUE doar dac variabila are o valoare setat (selectat), respectiv FALSE
n caz contrar.

Fig. 2.26. Caset CHECKBOX

<?php
echo $check;
if (empty($check))
echo "Variabila vida <br>";
if (isset($check))
echo "Variabila este setata <br>";
?>
O situaie special este cea n care mai multe casete sunt selectate simultan
(cazul INPUT checkbox), sau mai multe opiuni sunt selectate simultan (cazul
SELECT cu atributul MULTIPLE). Codul urmtor permite ilustrarea acestei situaii, iar
problema care se pune este legat de modul n care scriptul PHP apelat tie s preia
i interpreteze aceti parametri cu valori multiple.
<form METHOD="GET" ACTION="apelat.php">
<SELECT MULTIPLE NAME="meserie[]">
<OPTION selected VALUE="Inginer"> Inginer
<OPTION VALUE="Sofer" > Sofer
<OPTION VALUE="Dentist"> Dentist
</SELECT>
Auto: <input type="checkbox" name="vehicol[]" value="Dacia" /> Autoturism
Dacia
<input type="checkbox" name="vehicol[]" value="Ford" /> Ford <p>
<input TYPE="SUBMIT" VALUE="Cauta">
</form>
Scriptul PHP necesit, ntr-un astfel de caz, trimiterea parametrilor ca iruri
array (meserie[],vehicol[]), iar preluarea i interpretarea valorilor singulare se poate

2.11. Transferuri de parametri

127

face folosind construcia foreach, specific extragerii elementelor unui ir. Codul de
prealuarea a acestor valori multiple este prezentat n continuare (construciile if
permind evitarea unor mesaje de avertizare n cazul n care nici o selecie nu este
realizat) .
<?php
$sir=$_GET[meserie];
if ($sir) {
// TRUE -dac s-a fcut o selecie
foreach ($sir as $element)
{
echo $element;
}}
$sir1=$_GET[vehicol];
if ($sir1)
// sau echivalent: if(!(empty($sir1)), ! fiind operator de negare logic
{
foreach ($sir1 as $element)
{
echo $element;
}} ?>

2.11.2. Comenzi pentru transferul unor parametri speciali


Comenzile urlencode i urldecode sunt utilizate pentru pasarea unor
parametri string al cror coninut include mai multe cuvinte (i deci implicit spaii)
sau caractere speciale. n cadrul coninutului unui asemenea parametru, utiliznd
urlencode, spaiile vor fi nlocuite cu semnul +, specific construciei unui ir URL
(Uniform Resource Locator). [1][20]
Spre exemplificare, fie scriptul urmtor cu numele a.php (fig.2.27):
<?php
echo $produsa;
$produsa1=urlencode($produsa);
echo "<form name=myform method=post action=b.php>";
echo "<input type=text name=produs value=$produsa>";
echo "<input type=text name=produs1 value=$produsa1>";
echo "<input type=SUBMIT value=Validez selectiile >";
echo "</form>";
?>
Un apel al acestui script (i o apsare a butonului SUBMIT), din linia de
comand a browser-ului, cu un parametru de forma unui string format din mai
multe cuvinte: a.php?produsa=un sir ceva mai lung
va avea efectul din figura 2.28. Se poate observa o trunchiere a valorii parametrului
transmis spre prima caset de tip input, n timp ce a doua caset conine irul
ntreg (cu semnul + ntre cuvintele distincte).
O afiare a valorilor pasate i prelucrate de un script int b.php (apelat n
cadrul formularului form din cadrul scriptului anterior):
<?php
echo 1 .$produs;
echo "<p>";
echo 2 .$produs1;

128 PHP - 2
echo "<p>";
$produs1=urldecode($produs1);
echo 3 .$produs1;
?>
are urmtorul rezultat:
1 un
2 un+sir+ceva+mai+lung
3 un sir ceva mai lung

Fig. 2.27. Transfer de parametri

Se poate observa ca functia urldecode permite o refacere exact a irului


(string-ului) iniial i preluarea coninutului exact al parametrului astfel transmis
(fig.2.27).

2.11.3. Transfer UPLOAD


PHP este capabil s recepioneze fiiere asupra crora s-a realizat o operaie
de upload de ctre un browser client. [1][20] Aceast caracteristic permite
clienilor s realizeze upload-uri asupra fiierelor text sau binare.
Upload este operaia invers a download-ului. Dac prin download se pot
descrca (transfera) fiiere de pe server pe un host client, prin upload se poate
realiza un transfer n sens invers: de pe un computer client pe hostul server (cu
condiia ca drepturile de scriere pe server sa permit acest lucru. Pentru
exemplificare, un caz concret vizeaz stocarea ntr-o baz de date a unor fiiere
imagine (n coloane de tip BLOB), operaie necesitnd obligatoriu realizarea
anterior a unui transfer upload.pe serverul Web al fiierelor vizate
Un ecran pentru realizarea unui upload de fiier, poate fi realizat printr-un
FORM special cu structura urmtoare (spre exemplu):
<FORM ENCTYPE=multipart/form-data ACTION=upload.php METHOD=POST>
<INPUT TYPE=hidden name=MAX_FILE_SIZE value=1000000>
Send this file: <INPUT NAME=userfile TYPE=file>
<INPUT TYPE=submit VALUE=Send File>
</FORM>

2.11. Transferuri de parametri

129

Parametrul MAX_FILE_SIZE are doar o valoare informativ pentru browser


(limita fiind impus de setrile browser-ului). De remarcat tipul special de FORM
folosit, precum i tipul file folosit pentru una din casetele INPUT. Efectul acestui
FORM pe ecran este prezentat n figura 2.28.
Urmtoarele nume de variabile sunt definite i se presupun a fi utilizate n
legtur direct cu numele userfile al fiierului de upload-uit din exemplul iniiat:
-$userfile numele fiierului temporar n care fiierul de transferat este
stocat pe server (acelai cu cel al casetei INPUT de tip FILE)
-$userfile_name numele original, inclusiv calea spre fiierul de pe sistemul
transmitor
-$userfile_size dimensiunea fiierului de transferat n bytes
-$userfile_type - tipul MIME al fiierului, dac browserul ofer aceast
informaie (spre exemplu image/gif).
n acest caz (legat direct de exemplul dat), coninutul variabilei sistem
$HTTP_POST_FILES este urmtorul:
- $HTTP_POST_FILES[userfile][name] - numele original al fiierului pe maina
client
- $HTTP_POST_FILES[userfile][type] - tipul (MIME) al fiierului
- $HTTP_POST_FILES[userfile][size] - dimensiunea fiierului upload n bytes
- $HTTP_POST_FILES[userfile][tmp_name] - numele temporar al fiierului n care
este transferat i stocat pe server
Fiierele sunt stocate implicit n directorul temporar implicit al serverului
(dac nu este precizat un alt director temporar al PHP-ului, prin fiierul de
configurare php.ini).

Fig. 2.28 Formular FORM pentru upload

Iat un exemplu concret (prezentat n dou variante):


- prima variant:

130 PHP - 2
<?php
// verificarea operaie upload valid
if(is_uploaded_file($HTTP_POST_FILES[userfile] [tmp_name]))
{
// transfer efectiv
copy($HTTP_POST_FILES[userfile][tmp_name],
c:\\php\\loaded\\.$HTTP_POST_FILES[userfile][name]);
echo OK upload valid;
}
else
{ echo operaie euata;
}
?>
n prima variant, funcia is_uploaded_file()cu sintaxa:
bool is_uploaded_file (string filename)
returneaz TRUE dac fiierul filename a fost transferat printr-o operaie
valid de upload via HTTP POST.
Funcia COPY realizeaz un transfer al
fiierului temporar upload-uit la o locaie dorit. Primul parametru al comenzii COPY
(tabloul special $HTTP_POST_FILES) localizeaz fiierul surs (verificarea unei surse
de upload fiind realizat prin funcia is_uploaded_file), iar cel de-al doilea este
practic destinaia.
- a doua variant:
<?php
// upload direct
move_uploaded_file($HTTP_POST_FILES[userfile] [tmp_name],
c:\\php\\loaded\\.$HTTP_POST_FILES[userfile][name]);
?>
n a doua variant, funcia move_uploaded_file() cu sintaxa:
bool move_uploaded_file (string filename, string destination), nglobeaz ambele
operaii executate n varianta unu, fcnd att verificarea anterior menionat, ct i
transferul la o locaie dorit. Dac verificarea operaiei upload nu este valid
(FALSE), nici o aciune nu este efectuat. Numele indicilor variabilei tablou
($HTTP_POST_FILES) [userfile] [tmp_name] [name]) sunt alese de ctre
programator.

2.11.4. Variabile cu nume construite dinamic


Variabilele cu nume construite dinamic sunt utile n special n cazul n care
este necesar utilizarea unui numr mare de variabile, necunoscut apriori, ca soluie
alternativ la utilizarea irurilor.
Exemplu:
$fluctuant=5;
for ($i=1;$i<$fluctuant;$i++)
{
// generare nume noi variabile (var1, var2, ,var5)
$var="var".$i;
// atribuire valori ($var1=1, $var2=2,)
$$var=$i;

2.11. Transferuri de parametri

131

// referire variabile i afiare coninut ($$var) atribuit variabilelor


echo $$var."<p>";
}
// 4 variabile construite afiare valori atribuite
echo $var1."<p>".$var2."<p>".$var3."<p>".$var4;
Dup cum s-a menionat, alternativ o constituie utilizarea construciilor de
tip ir (array). Iat i o exemplificare privind transferul printr-o sesiune a unui ir de
variabile sesiune ntre dou scripturi, referite ca elemente ale unui ir:
Tabel 2.6.
Script a.php
Script b.php
<?php
<?php
session_start();
session_start();
for($i=0;$i<5;$i++)
for($i=0;$i<5;$i++)
{
{
$_SESSION['var[$i]']="ceva";
echo $_SESSION['var[$i]'];
}
}
echo "<a href='b.php'>Go!";
?>
?>$

2.12. Informaii sistem


2.12.1. Informaii asupra datei i timpului curent
Sunt prezentate cteva funcii utile pentru obinerea datei i timpului curent
al sistemului (time( ), strftime( ), getdate( ). Este important uneori obinerea
exact a datei (inclusiv a momentului de timp) aferente execuiei unei anumite
operaii, astfel nct doar timpul de pe serverul Web (acelai pentru toi clienii
apelani) poate fi luat n considerare. [1] Codul surs al unui exemplu de utilizare
este urmtorul:
<?php
//data curent ca string
echo "Timpul ca string: ".time()."<hr>";
// funcia strftime( ) convertete timpul curent ntr-o dat formatat
$data=strftime("%d.%m.%Y",time());
echo "Data ca string an, luna, zi: ".$data."<br>";
// tot funcia strftime( ) convertete timpul curent ntr-un timp formatat
$time=strftime("%H%M",time());
$time1=$time/100;
echo "Timpul (ora, minut): ".$time1."\n"."<hr>";
//extragere zi, luna, an din time() ca elemente ale unui ir ( data ca array)
$data1=getdate(time());
// construcie data si timp afiat formatat
$var="Data: ".$data1["mday"].".".$data1["mon"]."."
.$data1["year"]." "."Timp: ".$time1.".";

132 PHP - 2
print ($var."<br>");

// afiare

// strtoupper - conversie la caractere mari


echo "<strong>".strtoupper($var);
// afiare
?>
Figura 2.29 este elocvent asupra efectului fiecrei funcii utilizate.
Funcia time( ) returneaz timpul n secunde (ca string), scurs de la
nceputul Epocii Unix (1 Ian. 1970). Funcia este util, prin utilizarea mpreun cu
alte funcii, pentru determinarea datei sau timpului curent (folosit de regul ca
referin). Funcia strftime( ) formateaz timpul/data, conform unui ablon dat ca
argument, returnnd un string, pe baza informaiei furnizate de time( ).

Fig.2.29 Rezultate privind timpul i data calendaristic

Funcia getdate( ) returneaz un ir cu data calendaristic, permind


referirea i afiare element cu element (zi, lun, an). Funciile strtoupper( ),
strtolower( ) realizeaz o conversie a unui ir de caractere (furnizat ca argument) la
caractere mari, respectiv mici.

2.12.2. Informaii privind accesul client


n exemplul din paragraful anterior s-a realizat o contorizare a numrului de
accese la o pagin Web. O alt informaie util, referitoare la accesarea unei pagini
Web, rezid din ntrebarea Cine a accesat pagina Web? Acest cine nsemn mai
precis Care este adresa IP a clientului care s-a conectat la pagina Web curent?.
Pentru a rspunde la aceast ntrebare i nu numai, se consider scriptul
prezentat n continuare [1]:
<?php
//obinere informaii de mediu
$I=getenv(REMOTE_ADDR);
$j=getenv(SERVER_NAME);
//afiare informaii de mediu
printf( Your IP number is : %s\n,$I);
printf( The server name is : %s\n,$j);
?>
Funcia getenv cu sintaxa:
string getenv (string nume_variabil)

2.12. Informaii sistem 133


are ca parametru de intrare o variabil predefinit de mediu. n cazul de fa, cele
dou variabile au urmtoarea semnificaie:
REMOTE_ADDR adresa IP a clientului
SERVER_NAME numele serverului
Evident, utilizarea funciei getenv ( ) avnd ca parametru o variabil
predefinit de mediu, are ca rezultat returnarea unui string coninnd nsi
informaia asociat semnificaiei acelei variabile.
Afiarea rezultatelor pentru exemplul considerat s-a realizat folosind o
funcie de afiare formatat: printf().
n cazul de fa %s nsemn c, coninutul variabilei de afiat va fi tratat i
formatat ca un string (\n nsemn deja cunoscutul linie nou). Alte argumente de
formatare posibile pentru printf(): %d ntreg cu semn n reprezentare zecimal, %f
numr n virgul flotant, %b ntreg n reprezentare binar etc.

2.12.3. Generare e-mail


Realizarea operaiei de trimitere a unui e-mail utiliznd un script PHP implic
n primul rnd existena unei conexiuni la un server de mail SMTP, urmat de o
configurare corespunztoare a ctorva opiuni din fiierul php.ini.
Presupunnd c, numele serverului SMTP este aut.upt.ro, iar adresa de email a emitentului este adm@domeniu1.ro,configurarea fiierului php.ini implic
urmtoarele (pentru o platforma Win32):
[mail function]
; For Win32 only.
SMTP= aut.upt.ro ; for Win32 only
; For Win32 only.
Sendmail_from= adm@domeniu1.ro; for Win32 only
n acest moment, totul se rezum la utilizarea funciei mail(), aa cum se
poate observa i n scriptul urmtor:
<?php
$a=mail(dan@aut.upt.ro, Acesta e un subject!!!, Asta este continutul);
echo $a;
// 1- pt. Reuit, 0 pt. Nereuit
?>
n exemplul prezentat, s-a utilizat o form sintactic redus a funciei
mail(), avnd doar 3 argumente de intrare: adresa destinatarului, subjectul mailului, coninutul propriu-zis. Funcia returneaz 1 n caz de reuit, respectiv 0 n
caz de nereuit.

2.13. Servicii Web cu PHP


Un serviciu Web este o component Web oferind o serie de metode care pot
fi invocate (apelate, consumate) prin intermediul Web-ului (deci remote, la
distan), folosind standarde deschise de comunicare. Practic, un apel de serviciu
Web asigur o funcionalitate similar cu cea a unei RPC - Remote Procedure Call
(apel de procedur la distan), diferenele fiind la nivelul tipului de apel, serviciul
fiind invocat printr-un apel HTTP (utiliznd protocolul SOAP). Mai mult, apelul
serviciului poate fi fcut att dintr-o aplicaie WEB, ct i dintr-o aplicaie desktop.

134 PHP - 2
Avantajul major al utilizrii serviciilor Web const n faptul c, anumite
funcionaliti dorite i deja existente ca implementare, pot fi integrate direct n
cadrul unei aplicaii, ne mai trebuind a fi codate, fiind rapid accesibile prin simple
apeluri la componente deja existente. [14]
Un serviciu Web dispune de cteva proprieti intrinseci, putndu-se
enumera urmtoarele:
- este o component software de sine stttoare (auto-ncapsulat i autodescriptiv), apelabil (consumabil) dintr-o alt aplicaie (Web sau Windows
desktop);
- are ca element de baza pentru transferul informaiei formatul XML;
- comunica utiliznd protocoale deschise SOAP (Simple Object Access
Protocol - protocol standard pentru transmiterea de mesaje ntre diferite module,
definind regulile de procesare a unui mesaj, convenii de apelare a procedurilor la
distan (Remote Procedure Call - RPC) i de reprezentare a raspunsurilor la aceste
apeluri;
- vizibilitate asigurat de sistemul UDDI (Universal Description, Discovery
and Integration), ca sistem de baz pentru localizarea serviciilor Web, acesta
fcndu-le public existena pentru a putea fi consumate;
- autodescriere asigurat de metoda WSDL (Web Services Description
Language) care asigur o descriere a interfeei pentru utilizarea serviciului, crend
documentele care descriu metodele serviciului, parametri i argumentele acceptate
ale acestora, date returnate etc.)
Pot fi de asemenea punctate cteva proprieti funcionale:
- permit crearea de aplicaii independente de platform (sisteme de operare,
instrumente, limbaje de programare folosite);
- implementeaz componente care pot comunica ntre ele (indiferent de
platform);
- un serviciu Web furnizeaz informaii pentru descoperirea i descrierea lui
(i a metodelor lui, parametrilor de apelare, date returnate etc.).
Limbajul PHP (ca i alte limbaje de programare Web) permite operarea cu
serviciile Web, oferind n acest sens biblioteca extensie php_soap.dll (necesitnd
activarea ei prin configurarea corespunztoare n fiierul php.ini). Problematica
serviciilor Web este tratat la ora actual intr-o mulime de cri i site-uri dedicate
unele chiar exclusiv acestui subiect [14] [15] [26]. n paragraful de fa nu se va
intra n detalii privind modul de creare a serviciilor Web utiliznd PHP-ul, fiind oferit
o simpl exemplificare privind consumarea unui serviciu Web. Pentru cazul tratat s-a
considerat apelul unui serviciu Web oferind cursul valutar curent, disponibil pe
Internet la adresa:
http://www.infovalutar.ro/curs.asmx?wsdl
Codul unui posibil script PHP care realizeaz consumarea acestui serviciu
este prezentat n continuare, cu comentariile de rigoare [27]:
<?php
// Configurare php.ini -> php_soap.dll
// Instaniere obiect SOAP
$client = new SoapClient("http://www.infovalutar.ro/curs.asmx?WSDL");
// Apel metod cu data ultimei actualizri (fr parametri)
$result = $client->lastdateinserted();
// afiare dat - se apeleaz singura proprietate pe care o are obiectul returnat

2.13. Servicii Web cu PHP

135

echo "Data ultimei actualizari: ".


$result->LastDateInsertedResult."<br><b>";
// Se apeleaz metoda (cu un parametru de intrare)
$result = $client->GetLatestValue
(array('Moneda'=>'EUR'));
// afiare curs - proprietatea pe care o are obiectul returnat
echo 'Euro: '.$result->GetLatestValueResult.PHP_EOL;
// apel metod cu un parametru
$result = $client->GetLatestValue
(array('Moneda'=>'USD'));
// afiare curs valutar apelnd proprietatea pe care o are obiectul returnat
echo 'USD: '.$result->GetLatestValueResult;
?>
Rezumnd, etapele necesare consumrii unui serviciu Web folosind biblioteca
extensie php_soap.dll sunt urmtoarele:
- Instaniere obiect SOAP:
$client = new SoapClient;
- Apel metoda (cu parametri):
$result = $client->metoda(array(param1=val1, param2=val2.));
- Apel proprietate pentru afiare:
echo $result->Proprietate;
Rezultatul rulrii scriptului anterior este prezentat n figura 2.30:

Fig.2.30. Apel serviciu Web afiare curs valutar

Observaie: PHP permite dezvoltarea de aplicaii integrnd servicii Web bazate i pe


altor pachete extensie (spre exemplu, nuSOAP ca suport coninnd un grup de clase
PHP destinate crerii i operrii cu servicii Web).[28]

136 PHP - 2

2.14. Programare PHP orientat pe obiecte


Programarea orientat pe obiecte (OOP Object Oriented Programming) a
aprut ca o necesitate n contextul creterii complexitii codului aplicaiilor
software. Pentru aplicaiile de mari dimensiuni, o dezvoltare structurat a codului
(orientat pe funcii/proceduri) implicnd existena unui numr foarte mare de linii
de cod (uneori puternic redundant), prin modul de organizare a codului conduce la
o lizibilitate sczuta a acestuia i implicit, la mari dificulti privind realizarea
unor modificri ulterioare n cadrul aplicaiei.
OOP ofer o modalitate diferit de organizare a codului i a datelor n cadrul
unui program. [29]
Din acest punct de vedere, elementele constructive de cod specifice OOP
sunt clasa, respectiv obiectul. Clasa reprezint definiia unui obiect (planul
obiectului). Prin instanierea unei clase este creat un obiect (evident se pot face
instanieri multiple, construindu-se mai multe obiecte ale aceleiai clase). n cadrul
clasei (definiia obiectului) sunt precizate
- atribute sau proprieti (practic partea de date a obiectului) reprezentate
prin declaraii de variabile, inclusiv posibile iniializri ale acestora;
- metode (partea de cod a obiectului) reprezentate prin funcii (sau
proceduri) constituind totodat i interfaa obiectului destinata manipulrii datelor
acestuia.
OOP este fundamentat pe 3 principii de baz:
- ncapsulare fiecare obiect este de sine stttor i complet autonom
(coninnd att date -proprieti-, ct i cod metode). Un obiect are o interfa
clar, bine definit, folosit pentru a manipula obiectul;
- motenire;
- polimorfism.
Asupra ultimelor dou se va reveni n contextul programrii n PHP (existnd
cteva particulariti specifice acestuia). Particularizat la PHP, n continuare sunt
tratate urmtoarele aspecte [20]:
- Crearea unei clase (proprieti, metode)
- Crearea unui obiect (instanierea clasei)
- Utilizarea proprietilor obiectului
- Apelul metodelor obiectului
- Motenirea
- Polimorfismul
n limbajul PHP, crearea unei clase se face utiliznd instruciunea class. O
definire minimala a unei clase, este prezentata mai jos:
class denumire_clasa {
}
n vederea atribuirii unei funcionaliti clasei. este necesar definirea unor
proprieti i metode. Proprietile se creeaz prin declararea unor variabilelor la
nceputul definiiei unei clase folosind instruciunea var. Urmtoarea secven PHP
creeaz o clas denumit Clasa1 avnd dou atribute (proprieti): $message,
$data (ultimul fiind i iniializat).
class Clasa1 {
var $message;
var $data=initializat;
}
Metodele se creeaz prin declararea unor funcii PHP n definiia clasei. Codul
urmtor va crea (pentru clasa Clasa1) dou metode:

2.14. Programare PHP orientat pe obiecte

137

- metoda setMessage, avnd un parametru de intrare ($param) i permind


o setare a valorii proprietii $message. De remarcat c, n cadrul definiiei clasei,
referirea unei proprieti a acesteia se face folosind operatorul $this care precede
numele proprietii (nume utilizat fr $ n fa). n cazul de fata: $this->message.
- metoda getMessage, fr parametrii de intrare, care afieaz un mesaj,
respectiv returneaz valoarea proprietii $message.
<?php
class Clasa1
{
var $message;
var $data=initializat;
function setMessage($param)
{
$this->message = $param;
}
function getMessage()
{
echo "Mesajul pentru obiectul 1 este:<br>";
return $this->message;
}
}
// . . .cod PHP instaniere clas
?>
Evident s-a inclus codul n tag-urile de delimitare specifice PHP. Dup ce a
fost creata clasa, n continuare se prezint modul de instaniere a clasei n vederea
crerii unui obiect, precum i modul de setare a proprietilor acestuia i de apel al
metodelor (prin completarea secvenei anterioare, dup ncheierea definiiei clasei):
$Obiect1 =new Clasa1();
$Obiect1->setMessage("Setarea proprietate folosind o metoda");
echo $Obiect1->getMessage();
$var=$Obiect1->getMessage();
echo $var;
$Obiect1->message="Setare directa a proprietatii printr-o atribuire ";
echo $Obiect1->getMessage();
echo $Obiect1->data;
Rezultatul rulrii scriptului este urmtorul:
Mesajul pentru obiectul 1 este:
Setarea proprietate folosind o metoda
Mesajul pentru obiectul 1 este:
Setarea proprietate folosind o metoda:
Mesajul pentru obiectul 1 este:
Setare directa a proprietatii printr-o atribuire
initializat
Ulterior declarrii unei clase, este necesara crearea un obiect cu care acesta
s opereze. Operaia este denumita instanierea unei clase sau crearea unei

138 PHP - 2
instane. n limbajul PHP pentru aceasta operaie, se utilizeaz instruciunea,
cuvntul cheie new.
- Deci prima linie din secvena de cod anterioar creeaz un nou obiect
Obiect1 prin instanierea clasei Clasa1.
- n continuarea se face un apel al metodei setMessage ($Obiect1>setMessage) pasndu-i un parametru, metoda care permite setarea proprietii
message. Linia urmtoare apeleaz metoda getMessage (fr parametrii), care
afieaz un mesaj i returneaz o valoare (a proprietii message, afiat pe ecran
folosind echo).
- Valoarea returnat putea fi evident memorat ntr-o variabil ($var n cazul
de fa).
- n acest caz, setarea proprietii message a fost realizat prin apelul unei
metode. Setarea unei proprieti a unui obiect se poate face i prin atribuirea direct
a unei valori ctre proprietatea referit ($Obiect1->message="Setare directa a
proprietatii) sau chiar printr-o iniializare n definiia clasei (vezi proprietatea
$data). Toate comenzile de afiare (echo) au fost utilizate doar pentru a evidenia
modul de referire a atributelor/metodelor obiectului.
Observaie: n cazul limbajul PHP nu se limiteaz accesul la proprieti. Implicit
toate proprietile sunt de tip public, neputnd fi declarate private sau protected.
Orice proprietate declarat n definiia clasei poate fi referit n exteriorul ei printr-o
construcie de tipul: $Obiect->nume_proprietate;
O metod special a unei clase este aa numita metod constructor. O
metoda constructor are acelai nume cu al clasei, fiind apelata automat la crearea
unui obiect (realiznd operaii de iniializare, crearea de alte obiecte necesare
obiectului n cauza etc.). Un constructor se declar similar cu celelalte metode,
singura deosebire fiind ca are acelai nume ca i clasa. n PHP definirea unei metode
constructor nu este obligatorie. Clasa anterior creata nu avea definit un constructor
(unele proprieti fiind ns iniializare direct odat cu declararea lor).
Pentru exemplificare, se va crea un constructor pentru Clasa1, care va afia
un mesaj i va iniializa proprietatea $message. Definiia anterioar a clasei se va
completa cu nc o metod (avnd acelai nume cu al clasei):
function Clasa1()
{
echo "Obiect creat<br>";
$this->message = "initializare_obiect1";
}
O simpl secven de creare a obiectului va apela imediat metoda
constructor:
$Obiect1 =new Clasa1();
echo $Obiect1->message;
iar rezultatul va fi:
Obiect creat
initializare_obiect1
Pentru ca o clas deja creat s poate fi instaniat n mai multe scripturi
PHP, fr a se face o replicare (copiere) a codului clasei n fiecare script, de regul
definiiile claselor sunt pstrate n fiiere distincte de cele n care sunt create
obiectele. Pentru cazul de fa, spre exemplu, ntr-un fiier clase.php este salvat

2.14. Programare PHP orientat pe obiecte

139

definiia clasei, n timp ce ntr-un alt fiier PHP (obiect.php spre exemplu) se face
instanierea clasei (i utilizarea obiectului):
<?php
// fiier obiect.php
include("clase.php");
$Obiect1 =new Clasa1();
echo $Obiect1->data;
?>
Evident fiierul clase.php poate conine definiiile mai multor clase.
O caracteristic important a OOP o reprezint motenirea care permite
crearea unei relaii ierarhice ntre clase, folosind subclase. O subclasa, practic
motenete proprietile i metodele unei superclase. Prin intermediul motenirii, pe
lng elementele motenite (proprieti i metode), n cadrul noii clase se pot
construi i aduga noi elemente (proprieti sau metode). Astfel, pornind de la clase
de baza simple se pot deriva clase mai complexe i mai specializate pentru o
anumit aplicaie. Utilizarea motenirii crete gradul de reutilizare i lizibilitate al
codului surs, avantaj important al OOP (reducndu-se substanial munca
programatorului n cazul n care aceleai metode pot fi scrise doar o singur dat
ntr-o superclas, n loc s fie scrise de mai multe ori n subclase separate). Pe baza
superclasei Clasa1 (n acelai fiier script), se construiete prin derivarea acesteia o
nou subclasa Clasa2 (utiliznd cuvntul cheie extends), care motenete toate
proprietile i metodele superclasei, dar n acelai timp are i alte noi proprieti i
metode:
class Clasa2 extends Clasa1
{
var $message2="gama";
function getMessage()
{
echo "mesajul nou pentru obiectul 2 este<br>";
return $this->message2;
}
function plus()
{
echo "<br>ceva nou<br>";
}
}
De remarcat c, n cadrul subclasei Clasa2 se definete o metod avnd un
nume similar cu al unei metode din superclasa (getMessage), realizndu-se n cadrul
subclasei o suprascriere a metodei motenite, precum i o nou metod (plus). De
asemenea, noua clas are i o proprietate n plus ($message1).
O secven de instaniere i utilizare a obiectelor subclasei se poate face prin liniile
de cod urmtoare:
$Obiect2 =new Clasa2();
$Obiect2->plus();
$Obiect2->setMessage("beta");
echo $Obiect2->message."<br>";
echo $Obiect2->getMessage();
are rezultatul urmtor:

140 PHP - 2
Obiect creat
ceva nou
beta
mesajul nou pentru obiectul 2 este
gama
Crearea obiectului prin instanierea subclasei Clasa2 conduce i la
motenirea constructorului corespunztor (afindu-se Obiect creat). Apelul metodei
plus conduce la afiarea mesajului ceva nou. Apelul metodei motenite setMessage
permite setarea proprietii motenite message. Apelul metodei suprascrise
getMessage (plasat ntr-un echo), conduce la afiarea ultimelor dou rnduri.
Observaie: Mecanismul de motenire funcioneaz ntr-un singur sens, subclasa
(copil) motenete de la superclasa (printe). Orice modificare a clasei printe este
automat preluat i de clasa copil.
O alt caracteristic important a OOP o reprezint polimorfismul, prin
intermediul cruia clase diferite pot conine metode cu acelai nume, dar cu
comportamente diferite. Chiar n exemplul cu motenire, superclasa respectiv
subclasa conin metode cu acelai nume (getMessage), dar funcionaliti diferite.
Se consider nc un exemplu. n acelai script cu definiia clasei Clasa1, fie definiia
unei clase Clasa3:
class Clasa3
{
var $message;
function setMessage($param)
{
$this->message = $param;
echo "Clasa 3";
return $this->message;
}
}
La o instaniere a claselor i folosire a obiectelor create:
$Obiect1 =new Clasa1();
$Obiect3 =new Clasa3();
$Obiect1->setMessage("Setarea proprietate folosind o metoda:");
echo $Obiect1->getMessage();
$Obiect3->setMessage("Setarea proprietate clasei 3");
rezultatele sunt:
Obiect creat
Mesajul pentru obiectul 1 este:
Setarea proprietate folosind o metoda:
Clasa 3
Observaie: n PHP 4 nu este permis suprancrcarea metodelor (suprancrcare
overload- o aceeai metod avnd n cadrul aceleai clase definiii multiple, fiecare
cu un numr diferit de parametrii de intrare). ncepnd cu PHP 5 este introdus
experimental o funcie overload() pentru a putea beneficia de acest avantaj.

2.14. Programare PHP orientat pe obiecte

141

Un exemplu concret de utilizare a programrii orientate pe obiecte pentru


realizarea conexiunii la un server MySQL, respectiv la baza de date, este prezentat
n continuarea, n contextul n care aceste operaii implic o refolosire repetat a
aceleiai secvene de cod pentru fiecare script opernd cu baza de date.
Ca punct de start, se definete o clas (Clasa1) implementnd o metod
(setServer) executnd operaiile dorite (clas salvat ntr-un fiier script distinctClase.php-, care poate fi referit i inclus n orice alt script este necesar utiliznd
comanda include):
- Fiier Clase.php:
<?php
class Clasa1
{
function setServer($var1, $var2,$var3,$var4)
{
$returnez = @mysql_connect ("$var1", "$var2", "$var3") or die ("Eroare SERVER");
mysql_select_db("$var4") or die ("Eroare BD");;
return $returnez;
}
}
?>
Metoda clasei are patru parametri de intrare (nume server, user, parol,
numele bazei de date), returnnd n caz de reuit un identificator de conectare (util
pentru cazul conectrii la mai multe servere SQL, pentru identificarea unei anumite
conexiuni).
Utilizarea clasei, n orice script este necesar o conexiune la MySQL,
presupune o instaniere a ei (crend un nou obiect), urmat de un apel al
metodei ei, setat cu parametri adecvai:
<?php
include("clase.php");
$Obiect1 =new Clasa1();
$db=$Obiect1->setServer("localhost","root", "parola","baza");
echo 'Conectare OK!';
$query = "SELECT * FROM test";
$interoghez=mysql_query($query);
...
O soluie i mai compact ca i cod, presupune folosirea unui constructor i
astfel, la o instaniere a clasei se face i un apel automat al metodei realiznd
conectarea la server, respectiv la baza de date. Fiierul coninnd clasa are codul
urmtor:
- Fiier Clase.php:
<?php
//folosind constructor
class Clasa2
{
var $returnez;
function Clasa2($var1, $var2,$var3,$var4)
{
$this->returnez = mysql_connect("$var1", "$var2", "$var3") or die ("Error
connecting to mysql");
mysql_select_db("$var4");
return $this->returnez;

142 PHP - 2
}
}?>
Scriptul n care se face un apel la aceast clas pentru realizarea unei
conexiuni la o baz de date MySQL poate conine urmtorul cod:
<?php
include("clase.php");
$Obiect2=new Clasa2("localhost","root","parola", "baza");
$db=$Obiect2->returnez;
// referire identificator conectare
//cod interogare
.
.
.
?>

3.1. JavaScript

143

3. ELEMENTE JAVASCRIPT I AJAX


3.1. JavaScript
3.1.1. Elemente introductive JavaScript
JavaScript este la ora actual cel mai popular limbaj de script, rulnd pe
partea de client (browser Web), fiind destinat, n principal, sporirii interactivitii
paginilor Web. [8][17] Limbajul JavaScript, lucrnd mpreun cu elementele
(etichetele) limbajului HTML, asigur o reacie imediat la anumite evenimente
ataate acestor elemente, furniznd o dinamic sporit coninutului paginii Web.
[18] De asemenea, limbajul asigur posibilitatea unei validri rapide a datelor de
intrarea preluate prin formulare HTML, precum i diverse prelucrri de informaii pe
partea de client (inclusiv salvarea/accesarea unor date/resurse ale acestuia). Fiind
practic un limbaj interpretat de browser-ul Web, dependena acestuia de tipul de
browser este evident. [30] Astfel, este posibil ca o secven de cod JavaScript s
aib un comportament pe un anumit browser Web, respectiv alt comportament pe
un alt browser. Primul browser care a nglobat un interpretor JavaScript a fost
Netscape Navigator 2.0, la ora actual toate browser-ele Web integrnd JavaScript
ntr-o form care se dorete ct mai standardizat. n procesul de dezvoltare al unei
aplicaii Web, avnd drept fundament HTML-ul, codul JavaScript interacioneaz cu
etichetele statice HTML, oferind o comportare dinamic a acestora i implicit o
apropiere a comportamentului unei aplicaii Web de cel al unei aplicaii desktop.
Comparativ cu limbajele opernd pe partea de server, codul JavaScript, pe lng
dezavantajul dependenei de browser, nu poate fi ascuns, fiind total accesibil
oricrui apelant al paginii respective. Din acest motiv, exemplele de utilizare fiind la
ndemna oricui fr nici o restricie, n cadrul acestui capitol nu se va face o
prezentare n extenso a limbajului, orice programator familiarizat cu limbajul C
putnd s preia de pe Internet secvene de cod JavaScript (integrate n diverse siteuri) dedicate celor mai diverse funcionaliti dorite.
Observaie: A nu se confunda JavaScript cu Java, ambele fcnd parte de familia de
limbaje C/C++, dar fiind complet diferite ca i concept i structur.
Un simplu exemplu introductiv este prezentat n continuare pentru a
evidenia modul de integrare a HTML-JavaScript ntr-un script rulnd client-side:
<html
<head>
<title>Exemplu JavaScript</title>
</head>
<body>
<a href="javascript:buna()">Rulare JavaScript</a>
</body>
</html>
<script language="JavaScript">
function buna()

144 ELEMENTE DE JAVASCRIPT I AJAX - 3


{
alert("Salut JavaScript!");
}
</script>
Codul precedent implementeaz o simpl funcie JavaScript genernd un
mesaj ntr-o fereastr popup la accesarea unei referine. Evenimentul declanator l
constituie un click pe referina respectiv. Se poate remarca sintaxa de descriere a
unei secvene de cod JavaScript (marcajele de nceput/sfrit cod), respectiv modul
ei de apelare (referire integrat n codul HTML).

3.1.2. Validare date numerice de intrare


Exemplul din paragraful curent prezint o funcie JavaScript declanat la
apsarea unei taste n interiorul unei casete INPUT dintr-un formular. Funcia
permite tastarea doar a cifrelor n interiorul casetei (respectiv a unor caractere de
control, spre exemplu backspace), evitnd astfel preluarea unor date eronate i
asigurnd o validare n timp real a coninutului casetei. De remarcat, n corpul
funciei, structura bifurcat care trateaz dou situaii de rulare a codului pe un
browser din familia Internet Explorer, respectiv familia Mozilla (sau altele).
Evenimentul ataat etichetei INPUT este onkeypress. Funcia returneaz o valoare
true sau false (funcie de codul ASCII al tastei apsate), valoarea false invalidnd
preluarea caracterului tastat (onkeypress="return false" > invalideaz preluarea de
caractere de la tastatur). Codul anterior explicitat este urmtorul:
<FORM action='tinta.php' method='GET'>
Salariu: <input type="text" name="sal" onkeypress="return onlyNo(event)">
<input type='SUBMIT' value='Start'>
</FORM>
<script language="JavaScript" type="text/javascript">
function onlyNo(evenim)
{
var e = evenim;
if(window.event)
{
// Internet Explorer
var charCode = e.keyCode;
}
else if (e.which)
{
// Mozilla, Firefox
var charCode = e.which;
}
// verificare plaja valori ASCII pentru cifre i caractere de control
if (charCode > 31 && (charCode < 48 || charCode > 57))
return false;
// &&, || -> I, SAU LOGIC
return true;
}
</script>

3.1. JavaScript

145

3.1.3. Validare coninut casete INPUT


Tot ca o aplicaie de validare a unor date de intrare, codul script urmtor
integreaz JavaScript pentru a fora completarea cu informaii a unor casete din
cadrul unui formular. [30] Comparativ cu exemplul din paragraful precedent, n
aplicaia de fa ns nu se verific coninutul informaiei, ci doar prezena unei
informaii (date) n aceste casete. Scopul acestei aplicaii este i de a puncta alte
cteva evenimente declanatoare ataate unor casete INPUT sau chiar unui ntreg
formular FORM, respectiv exemplificarea modului de referire a unor etichete HTML n
cadrul codului JavaScript. Scriptul cod este urmtorul (vezi i efectul prezentat n
figurile 3.1.a. i 3.1.b.)::
<!Cod formular HTML cu ataare evenimente JavaScript-->
<form method="GET" action="a.html" onsubmit="return checkform(this);" >
<table align="center">
<tr>
<td>Student:</td>
<td> <input type="text" name="nume"></td>
</tr>
<tr>
<td>Nota Parcurs:</td>
<td> <input type="text" name="nota1" onclick="return
checkinput_alt(form)"> </td>
</tr>
<tr>
<td>Nota Examen:</td>
<td> <input type="text" name="nota2" onclick="return checkinput(form)"
onblur="return checkinput(form)"></td>
</tr>
<tr>
<td colspan="2"><input type="submit" value="Adauga"> </td>
</tr>
</table>
</form>
<!--Descriere funcii JavaScript ataate codului HTML-->
<script language="JavaScript" type="text/javascript">
function checkform(form)
// verific coninut pentru toate casetele
{
if (form.nume.value == "") {
alert( "Nume student." );
//var bool=confirm(Alege); >Dialog Box
form.nume.focus();
return false ;
}
if (form.nota1.value == "") {
alert( "Nota Parcurs student." );

146 ELEMENTE DE JAVASCRIPT I AJAX - 3


form.nota1.focus();
return false ;
}
if (form.nota2.value == "") {
alert( "Nota Examen student." );
form.nota2.focus();
return false ;
}
return true ;
}
function checkinput(form)
// verificare caset precedent nota1
{
if (form.nota1.value == "")
{
alert( "Scrie ceva in campul 2 - Nota parcurs..." );
form.nota1.focus();
return false ;
}
return true ;
}
function checkinput_alt(form) // verificare caset precedent nume
{
if (form.nume.value == "")
{
alert( "Scrie ceva in campul 1 - Nume..." );
form.nume.focus();
return false ;
}
return true ;
}
</script>

Funcia checkform ataat formularului FORM i apelat cu parametrul this


(semnificnd eticheta curent HTML n cadrul creia este referit evenimentul
declanator al funciei - n cazul de fa, formularul FORM), verific succesiv (la
apsarea butonului de tip SUBMIT) coninutul celor trei casete din formular. Pe
fiecare din cele trei ramuri if, dac coninutul casetei referite este vid, focusul
rmne n acea caset pn la o completare cu date a acelei casete (spre exemplu,
pentru prima caset cu numele NUME din formularul FORM: form.nume.focus()). Se
poate remarca modul n care poate fi referit n JavaScript un element al unui
formular: form.nume.value preciznd succesiv numele formularului (form ca
parametru sau this ca formular curent), numele etichetei INPUT, respectiv
proprietatea value. Aceast verificare realizeaz o validare/invalidare a coninutului
casetelor abia n momentul unui eventual transfer al acestor date spre o alt pagin,
prin apsarea unui buton SUBMIT (deci dup eventuala completare a tuturor
cmpurilor formularului - fig.3.1.a.).

3.1. JavaScript

147

O variant mai rapid de validare const ntr-o verificare a coninutului


casetelor n momentul prsirii lor evenimentele declanatoare fiind onclick pe
caseta urmtoare (deci s-a prsit o caset al crei coninut este verificat, fcnd-se
click_mouse pe caseta urmtoare), respectiv onblur (pe caseta curent verificat fig.3.1.b.) semnificnd prsirea casetei focusate (tasta TAB, click mouse pe alt
caset), respectiv pierderea focusului acesteia.

Fig. 3.1.a. Validare la SUBMIT (verificare


la final)

Fig.3.1.b. Validare caseta la OnClick pe caseta


urmtoare (verificare on-line)

Construcia JavaScript de genul return funcie() (integrat n formularul


HTML) permite, n cazul n care funcia referit returneaz valoarea boolean FALSE,
anularea efectului evenimentului declanator (spre exemplu, pentru funcia
checkform, anuleaz efectul SUBMIT). Toate funciile referite n aplicaia de fa
returneaz FALSE n cazul nendeplinirii condiiei verificate.
Funciile checkinput, respectiv checkinput_alt verific coninutul unei
anumite casete precizate prin cod (nota1, respectiv nume). Important este
evenimentul care le declaneaz, respectiv eticheta HTML de care este ataat acel
eveniment. Astfel:
- Evenimentul onclick ataat casetei nota1, apeleaz funcia checkinput_alt
(avnd ca parametru chiar FORM-ul curent), verificnd coninutul casetei INPUT
precedente - nume.
- Evenimentul onclick definit pe caseta nota2, apeleaz funcia checkinput (avnd
ca parametru chiar FORM-ul curent), verificnd coninutul casetei INPUT
precedente- nota1.
- Evenimentul onblur, definit suplimentar pe caseta nota2, apeleaz tot funcia
checkinput, deosebirea fa de cazul precedent constnd n faptul ca onblur
semnific o prsire a casetei curente prin tasta sau prin click mouse pe orice alt
caset, declanndu-se la o pierdere a focusului de ctre caseta curent (prompterul prsete caseta). Altfel spus, onclick intercepteaz evenimentul corespunztor
generat de click mouse pe caset, iar onblur pe cel generat de o prsire a casetei
(echivalent cu onLeave n alte limbaje).
Prin strategia astfel adoptat, orice tentativ de prsire fr completare a
unei casete este anulat (prin returnare valoare FALSE de ctre funcia apelat),
respectiv focusul este repoziionat pe caseta n cauz (printr-o comand de genul:
form.caseta.focus()). Acest mod de verificare ncruciat a coninutului casetelor
INPUT, dublat de o verificare suplimentar la submiterea final, face practic
imposibil pasarea de ctre formular, spre scriptul apelat, a unor parametri nuli.

148 ELEMENTE DE JAVASCRIPT I AJAX - 3

3.1.4. Aplicaie de mapare pe o imagine


Aplicaia din acest paragraf are drept obiectiv funcional crearea unei hri
pe o imagine (operaie numit i mapare pe o imagine), care captureaz
evenimentele legate de deplasarea mouse-ului (onMouseMove), respectiv click-uri
ale mouse-ului pe aceasta (interceptate de o etichet ancor <A>), reacionnd n
consecin prin afiarea unor mesaje. Un map imagine definete anumite locaii pe o
imagine (n genul unei hri), browser-ul rspunznd (prin apeluri JavaScript) la
anumite interaciuni ale utilizatorului cu acestea.
n cazul de fa, sunt definite trei zone dreptunghiulare pe imagine: zona
titlul crii (partea de sus a imagini), numele autorilor (imediat sub zona titlu),
respectiv zona editur (n partea de jos a imaginii). Interaciunea cu tot restul zonei
global definit prin atributele WIDTH i HEIGHT ale etichetei IMG,este tratat de o
ramur separat a secvenelor de cod (ramura else). Pe tot restul ecranului aplicaia
nu asigur nici o interaciune. Figura 3.2 prezint pagina aa cum apare n browserul Microsoft Internet Explorer (scriptul, n forma descris n continuare, funcionnd
doar pe acest tip de browsere).
Codul complet al aplicaiei este urmtorul:
<HTML>
<FORM NAME="form1">
<A href="javascript:apasare_mouse()" >
<IMG SRC="poza.gif" WIDTH=162 HEIGHT=200
onMouseMove="javascript:miscare()" ></A><BR>
<INPUT TYPE="text" NAME="descriere"SIZE=50 value=" ">
</FORM>
<SCRIPT LANGUAGE="JavaScript">
<!-var x_curent, y_curent;
function apasare_mouse()
{
if (in_zona(x_curent,y_curent,0,0,161,50))
alert("Programare in JavaScript");
else if (in_zona(x_curent,y_curent,100,60,161,90))
alert("Autorii cartii");
else if (in_zona(x_curent,y_curent,0,120,161,199))
alert("Publicata in editura Sams");
else
alert("Alege o zona de imagine!"+" x: "+x_curent+" y: "+y_curent);
}
function in_zona(x,y,Rect_x1, Rect_y1, Rect_x2, Rect_y2)
{
return( x>Rect_x1 &&
x<Rect_x2 &&
y>Rect_y1 &&
y<Rect_y2);
}

3.1. JavaScript
function afiseaza_text(text)
{
form1.descriere.value=text;
}

149

//formular lips: descriere.value=text;

function miscare()
{
x_curent=event.x;
y_curent=event.y;
if (in_zona(x_curent,y_curent,0,0,161,50))
afiseaza_text("Programare in JavaScript");
else if (in_zona(x_curent,y_curent,100,60,161,90))
afiseaza_text("Autorii cartii");
else if (in_zona(x_curent,y_curent,0,120,161,199))
afiseaza_text("Publicata in Editura Sams");
else
afiseaza_text("Alege o zona de imagine!"+" x: "+x_curent+" y:
"+y_curent);
}
</SCRIPT>
</HTML>

Fig. 3.2. Mapare mesaje pe o imagine-hart folosind JavaScript

Din punct de vedere funcional, urmtoarele aspecte sunt relevante:


- la apelul scriptului (integrnd cod HTML i JavaScript), o pagin cu o imagine
(poza.gif), respectiv o caset de tip INPUT (nglobate ntr-un formular HTML avnd
numele form1) este generat i afiat pe ecran;
- La o deplasare a mouse-ului pe ecran, n caseta INPUT este afiat un mesaj textual
preciznd zona deasupra creia se deplaseaz mouse-ului. Dac pointerul mouseului nu se gsete ntr-o zon explicit mapat a imaginii, un mesaj solicitnd
alegerea unei zone de pe imagine, respectiv coordonatele curente ale mouse-ului

150 ELEMENTE DE JAVASCRIPT I AJAX - 3


sunt de asemenea afiate n caseta INPUT.
- Dac utilizatorul face un click mouse pe o zon mapat a imaginii, un mesaj
corespunztor, descriind numele zonei, este afiat ntr-o caset popup ALERT. n caz
contrar (click pe o zon din afara hrii), un mesaj de avertizare, nsoit de
coordonatele mouse-ului, este de asemenea afiat ntr-o caset JavaScript ALERT.
Din punct de vedere al codului, dou secvene distincte pot fi remarcate:
a) Secvena de cod HTML genernd fundalul hart al imaginii, respectiv
zona de afiare a unor mesaje ntr-o caseta HTML INPUT. De remarcat folosirea unei
etichete ancor <A> , al crei atribut href (referin hipertext - setat n mod
normal.spre un alt fiier script apelat), refer n cazul de fa o funcie JavaScript
(integrat n scriptul curent), interceptnd orice apsare de mouse (eveniment
implicit specific unei referine ancor <A>). Evident, n aceast secven,
elementelor HTML le sunt ataate evenimente, respectiv apeluri ale unor funcii
JavaScript adecvate funcionalitilor dorite.
b) Secvena de cod JavaScript, coninnd o declaraie de dou variabile
(vizibile n toate funciile din cadrul scriptului), respectiv patru funcii JavaScript,
fiecare cu o anumit funcionalitate.
n continuare este descris rolul fiecreia dintre cele patru funcii JavaScript
integrate n cadrul aplicaiei.
Funcia miscare() este prima apelat n momentul detectrii unei micri a
mouse-ului, citind i stocnd n permanen coordonatele curente ale mouse-ului
(x_curent=event.x; y_curent=event.y) n dou variabile publice, accesibile n tot
codul JavaScript. Integrat n cadrul codului acestei funcii, se realizeaz un apel al
unei a doua funcii numit in_zona.
Funcia in_zona, avnd drept parametri de intrare coordonatele curente ale
mouse-ului, respectiv coordonatele a dou puncte care definesc o anumit zon
vizat pe imagine (deci n total, 6 parametri), returneaz o valoare boolean TRUE
sau FALSE, dup cum coordonatele curente al mouse-ului definesc un punct din
interiorul, respectiv din afara zonei definite prin dou puncte (corespunznd
celorlali patru parametri ai ei). Operatorul && are semnificaia unui I logic, primii
doi parametri ai funciei fiind coordonatele x i y ale mouse-ului, iar urmtorii
parametri fiind coordonatele x i y ale celor dou coluri opuse (stnga-sus i
dreapta-jos) definind o zon dreptunghiular de mapare pe imagine.
Funcia miscare() verific, printr-o structur, if-else, ncadrarea pointerului
mouse-ului n una din cele trei zone distinct mapate pe imagine. n caz afirmativ, se
apeleaz o funcie afiseaza_text care va afia n caseta INPUT un mesaj
corespunztor. n caz contrar (ramura else), se va afia un mesaj adecvat,
incluznd i coordonatele curente ale mouse-ului.
i n fine, ultima funcie apasare_mouse face i ea apel la funcia care verific
ncadrarea coordonatelor curente ale mouse-ului n zonele definite/mapate pe
imagine (apelnd funcia in_zona ntr-o structur condiional if-else), iar funcie de
rezultatul boolean returnat, va afia mesajele adecvate, folosind de data aceasta o
caset JavaScript ALERT.
Dup cum s-a mai menionat, aplicaia anterioar funcioneaz corect doar pe
browsere din familia Internet Explorer, fiind o dovad a problemelor de
compatibilitate cu browserul pe care le ridic o operare cu JavaScript.
Dac se dorete o rulare i pe browsere din familia Mozilla, codul anterior
trebuie modificat corespunztor, astfel [33]:
- Etichetei IMG i se atribuie un nume pentru a putea fi referit n JavaScript:
<IMG
SRC="poza.jpg"
name="ceva"
WIDTH=200
HEIGHT=300

3.1. JavaScript

151

onMouseMove="javascript:miscare()">
- Scriptul JavaScript se modific /completeaz astfel:
Direct n secvena public executat la ncrcarea aplicaiei se adaug linia:
document.ceva.onmousemove = miscare1;
unde miscare1 este o nou funcie (construit pe scheletul deja existentei funcii
miscare), fiind apelat doar de browsere Mozilla la o deplasare a mouse-ului n
interiorul paginii, doar pe obiectul cu numele ceva (practic doar pe imaginea referit
prin eticheta IMG). Astfel, scriptul JavaScript va debuta cu secvena urmtoare:
<SCRIPT LANGUAGE="JavaScript">
<!-var x_curent, y_curent;
document.ceva.onmousemove = miscare1;
// document.onmousemove = miscare;
Dac se folosete linia comentat, funcia miscare1 intercepteaz
coordonatele mouse-ului de pe tot ecranul (i nu doar de pe zona limitat, impus
de coordonatele etichetei IMG cu numele ceva).
Funcia miscare1 se construiete pornind de la funcia miscare existent,
modificndu-se liniile citind coordonatele curente ale mouse-ului (parametru de
intrare e avnd semnificaia evenimentului onmousemove interceptat i avnd o
aciune definit prin secvena de cod JavaScript anterior precizat):
function miscare1(e)
{
x_curent=e.pageX;
y_curent=e.pageY;
...
Restul codului aplicaiei rmne nemodificat. Problema major rezolvat prin
modificrile anterioare a fost cea de a citi coordonatele curente ale mouse-ului
utiliznd o secven de cod JavaScript compatibil cu browserele Mozilla,
completnd totodat scriptul astfel nct aplicaia s poat rula adecvat pe ambele
tipuri de browsere.
Observaie: Deseori util pentru rezolvarea unor probleme de compatibilitate ale
limbajului JavaScript cu diverse tipuri de browsere, urmtoarea secven de cod
permite o identificare i afiare a numelui unui browser (utiliznd funcia JavaScript
navigator.appName [36]):
<html>
<body>
<div id="afis"></div>
<script type="text/javascript">
nume = "Nume Browser: " + navigator.appName + "</p>";
document.getElementById("afis").innerHTML=nume;
</script>
</body></html>
Codul anterior afiseaz Netscape ca nume pentru browser-ele familiei
Mozilla, respectiv Microsoft Internet Explorer pentru cealalt familie.
Exist o mulime de evenimente JavaScript, fiecare putnd fi ataate
diverselor elemente-etichete HTML, conducnd la o interaciune dinamic a acestora
cu utilizatorul. Tabelul 3.1 prezint doar o foarte scurt selecie a unor astfel de
evenimente, numite i evenimente HTML DOM (Document Object Model),
precizndu-se aciunea la care sunt declanate, respectiv eticheta HTML de care pot

152 ELEMENTE DE JAVASCRIPT I AJAX - 3


fi ataate (multe dintre aceste evenimente putnd fi comune mai multor etichete
HTML).[34][35]
Tabel 3.1.

Etichet
HTML
INPUT

FORM

Atribut Eveniment
onclick
onblur
onmousemove
onkeypress
ondblclick
onclick
onkeydown
onsubmit
onmouseover

SELECT

TEXTAREA

onchange
onmousemove
onfocus
onclick
onmouseout

Descriere
Click mouse pe caset
Pierdere focus caset (onLeave)
Deplasare mouse pe caseta INPUT
Apsare i lsare tast n caset
Dublu click n caseta
Click mouse pe formular (pe orice element
al acestuia)
Apsare o tast n formular (pe orice
element al acestuia)
Apsare buton SUBMIT
Pointer
mouse
se
mic
deasupra
formularului (deasupra oricrui element
din formular)
Schimbare opiune (selecie)
Deplasare mouse pe caseta SELECT
Focus pe o anumit opiune
Click mouse pe caset
Pointer mouse prsete caset

3.1.5. Transfer de informaie ntre HTML i JavaScript


3.1.5.1. Citire valori etichete INPUT n variabile JavaScript
Una dintre problemele care apar la operarea cu JavaScript este modul n
care coninutul/valorile unor elemente/etichete HTML se leag (comunic) cu
variabilele JavaScript. Prezentul paragraf trateaz, cazul n care se dorete o
preluare a coninutului unor casete INPUT (procedura putnd fi aplicat i altor
etichete HTML) i transferarea lui spre variabile JavaScript. n acest sens, cinci
exemplificri privind referirea n JavaScript a coninutului unor etichete INPUT sunt
prezentate i comentate, astfel:
- primele trei corecte i funcionale - evideniind mai multe forme de referire n
JavaScript a etichetelor HTML;
- una parial funcional - evideniind dependena de browser;
- una incorect - evideniind caracteristica case-sensitive a limbajului JavaScript.
Codul exemplificativ este urmtorul (comentariile nsoitoare fiind relevate
pentru aciunea lui):
<form name="myForm" method="GET" action="a.html" onsubmit="functie()" >
Name: <input type="text" id="nume" />
Time: <input type="text" name="timp"/>
<input type="SUBMIT" value="Query" />

3.1. JavaScript

153

<script language="javascript" type="text/javascript">


function functie()
{
//Corect (folosire ID in loc de NAME ca proprietate)
var var1=myForm.nume.value;
alert("ceva1 "+ var1);
//Corect:
var var1=document.getElementById("nume").value;
alert("ceva2 "+ var1);
//Corect:
var var1=myForm.timp.value;
alert("ceva3 "+ var1);
//Eroare pe Mozilla (proprietatea NAME nu substituie proprietatea ID),
//Funcional doar pe Internet Explorer!
var var1=document.getElementById("timp").value;
alert("ceva4 "+ var1);
//Gresit (case-sensitive!)
var var1=myForm.Timp.value;
// sau tot greit:
var var1=myForm.timp.VALUE;
alert("ceva5 "+ var1);
//Dup prima eroare, restul de cod nu se mai execut!
}
</script>
Pentru depanarea codului JavaScript, browser-ele dispun de faciliti care
semnaleaz eventuale erori i linia de cod n care apar (fie prin afiarea unor mesaje
de eroare cazul Internet Explorer, fie prin afiarea unei console de erori cazul
Mozilla). Figura 3.3 arat modul cum se poate afia consola erorilor (pentru Mozilla),
iar figura 3.4 detaliaz, pentru scriptul anterior comentat, eventuale mesaje de
avertizare, precum i prima eroare aprut (funcionarea scriptului ntrerupndu-se
dup aceasta) .

Fig. 3.3 Error Console (Mozilla)

154 ELEMENTE DE JAVASCRIPT I AJAX - 3

Fig. 3.4 Eroarea semnalat

3.1.5.2. Setare atribute etichete HTML cu coninut variabile


JavaScript
Operaie invers celei tratate n paragraful anterior, const n setarea unui
atribut corespunztor (atribut de coninut) al unei etichete HTML (INPUT, IMG) cu
valoarea unei variabile JavaScript.
Pentru exemplificare se consider o aplicaie Web care la apsarea unui
buton permite afiarea aleatoare a unei imagini dintr-un set predefinit de patru
imagini (folosind eticheta IMG), respectiv afiarea n cadrul unor casete text INPUT a
coninutului unei variabile indice, respectiv a coninutului elementelor unui ir
(array) JavaScript (fig. 3.5).
n momentul startrii aplicaiei, evenimentul onload (ataat etichetei
body), apeleaz funcia JavaScript initializare(). De asemenea, n codul JavaScript
sunt declarate dou variabile ir folosind constructorul Array() (vizibile n toate
funciile, unul dintre iruri fiind i iniializat). Funcia initializare() creeaz patru
elemente de tip imagine folosind constructorul Image(), atribuite elementelor irului
neiniializat (anterior declarat n seciunea public), setnd atributul src al fiecrei
imagini spre un anume fiier jpg.
La apsarea unui buton este apelat funcia afisez() care, genernd aleator
un numr ntreg (n intervalul 03) folosit ca indice pentru referirea unor elemente
din cele dou iruri, permite afiarea unei imagini (folosind eticheta IMG), respectiv
setarea unui coninut pentru cele dou casete INPUT (vezi fig. 3.5).
Codul complet al aplicaiei este urmtorul (comentrile suplimentare integrate
n el fiind elocvente, fr a mai fi necesare alte explicaii):
<body onload="initializare()">
<form name="myForm">
Nume: <input type="text" id="nume" >
Numar: <input type="text" name="numar">
<img src = "1.jpg"
name = "imagine"
height = 100
width = 100>

3.1. JavaScript

155

<input type = "button" value = "Aleator" onClick = "afisez()">


</form>
<script language="javascript" type="text/javascript">
//declaraii, iniializri vizibile n tot codul JavaScript
var descriere= new Array("zero", "unu", "doi", "trei");
var imagini = new Array();
function initializare()
{
imagini[0] = new Image(50,
imagini[0].src = "1.jpg";
imagini[1] = new Image(50,
imagini[1].src = "2.jpg";
imagini[2] = new Image(50,
imagini[2].src = "3.jpg";
imagini[3] = new Image(50,
imagini[3].src = "4.jpg";
}

50);
50);
50);
50);

function afisez()
{
// random - numere intre 0 si 1, floor - rotunjire la cel mai apropiat ntreg
var contor=Math.floor(Math.random() * 4 );
document.imagine.src = imagini[contor].src;
document.myForm.numar.value = descriere[contor];
myForm.nume.value = contor;
//ambele forme (cu i fr document)
}
</script>

Fig. 3.5 Setare atribute etichete HTML cu valori variabile JavaScript

Relevant pentru obiectivul paragrafului setarea atributelor unor etichete


HTML cu valori ale unor variabile JavaScript sunt liniile de cod urmtoare:

156 ELEMENTE DE JAVASCRIPT I AJAX - 3


document.imagine.src = imagini[contor].src;
document.myForm.numar.value = descriere[contor];
myForm.nume.value = contor;
Ca o concluzie privind modalitile de transfer bidirecional de informaie ntre
HTML i JavaScript (mai precis ntre atribute ale unor etichete HTML i variabile
JavaScript), tabelul 3.2 prezint o sintez relevant n acest sens:
Tabel 3.2

Citire valori etichete HTML (INPUT ) n variabile JavaScript


- etichete HTML referite prin id sau name
- etichete plasate ntr-un FORM myForm
id=nume
var1=myForm.nume.value;

name=nume
var1=myForm.nume.value;

var1=
document.getElementById("nume")
.value;

var1=
document.getElementById("nume").
value;
* Doar pe Internet Explorer (Nu i pe
Mozilla !!!)

Setare (scriere) atribute elemente HTML (INPUT, IMG, DIV ) cu coninut


variabile JavaScript
id=nume sau name=nume (unde e posibil) sau
name=imagine
document.myForm.nume.value = variabila;
myForm.nume.value = variabila;
document.imagine.src = figura.src;
figura.src=ceva,jpg;)

// (figura = new Image(50, 50);

var elem_div = document.getElementById('nume_DIV');


elem_div.innerHTML = variabila;
sau direct:
document.getElementById('nume_DIV').innerHTML = variabila;
Observaie: JavaScript este CASE-SENSITIVE (inclusiv la referirea numelui
atributelor unor elemente HTML!). Exemplu: atributul value corect, VALUE
incorect.

3.2. AJAX
3.2.1. Introducere n AJAX - comparaie cu tehnologia tradiional
JavaScript, ca limbaj de programare WEB (rulnd pe partea de client),
permite o mulime de aciuni care fac interfaa cu utilizatorul mult mai prietenoas.
Astfel, se pot implementa validri ale datelor introduse prin formulare, operare cu
imagini (vezi exemplele din paragrafele anterioare) meniuri, mesaje gen popup etc.
Fiind un limbaj de programare rulnd pe partea de client, JavaScript nu permite ns
transferul informaiei ntre browser-ul
(clientul) Web i serverul Web (fiind
interpretat uneori chiar diferit de diversele tipuri de browsere). Dac se dorete
preluarea unor date de la un server de baze de date sau trimiterea unor informaii
spre un script PHP (rulnd partea de server Web), codul HTML, mai precis un
formular HTML (FORM) ofer metodele GET i POST pentru comunicarea (transferul)
de parametri spre server, realiznd astfel un apel parametrizat al unor scripturi. n
momentul n care user-ul apsa un buton de tip Submit, eventualii parametri sunt
transferai spre server, ateptndu-se un rspuns din partea scriptului apelat, avnd
ca rezultat afiarea unei noi pagini integrnd informaia returnat (fig.3.6.a). Dac
serverul Web rspunde mai puin rapid (din diverse motive), utilizatorul are de
ateptat un anumit timp pn la ncrcarea i afiarea complet a noii pagini.
AJAX
(acronimul
pentru
Asynchronous
JavaScript
And
XML,
reprezentnd practic o grupare de tehnologii, gen JavaScript, XML, CSS, DOM, HTML
i DHTML), ncerc s remedieze aceast problem, lsnd codul JavaScript s
comunice direct cu serverul Web, prin utilizarea un obiect special JavaScript numit
XMLHttpRequest (sau un ActiveXObject).[16] Cu ajutorul acestui obiect, codul
JavaScript poate trimite sau primi informaii de la/spre server, fr a fi necesar
rencrcarea complet a paginii Web (printr-un eventual Reload), fcnd astfel
posibil un schimb bidirecional, asincron, de date cu serverul (practic cu scripturi
rulnd server-side). Astfel, o secven specific de cod JavaScript (rulnd pe partea
de client), poate comunica cu cod rulnd pe partea de server Web (fig.3.6.b).
Descrierile prezentate n figurile 3.6.a, respectiv 3.6.b permit o analiz comparativ
ntre o abordare clasic a modului de realizarea a apelurilor ntre diversele
componente, respectiv o abordare AJAX.

Fig.3.6.a. Apel clasic al unui script

158 ELEMENTE DE JAVASCRIPT I AJAX - 3

Fig.3.6.b. Apel tipic AJAX


AJAX ncearc totodat s elimine diferenele de funcionalitate i
interactivitate existente ntre o aplicaie desktop i o aplicaie Web (ultima
implicnd, n tehnologia clasic, o actualizare permanent a coninutului ntregii
pagini). Astfel, o soluie AJAX ofer posibilitatea de a utiliza dinamic controale HTML
i de a construi o interfaa interacionnd cu utilizatorul i oferindu-i faciliti
specifice aplicaiilor desktop [16][18].
AJAX nu este o tehnologie n sine, ci mai mult o colecie de tehnologii grupate
n jurul unui nucleu central fundamentat pe JavaScript. Pot fi enumerate
urmtoarele tehnologiile de baz implicate (mai mult sau mai puin) n construcia
unei aplicaii AJAX:
- HTML folosit pentru construcia formularelor Web, ca elemente interactive
de baz;
- JavaScript elementul central a unei aplicaii AJAX, coordonnd o
comunicaie asincron ntre interfaa client i nucleul aplicaie rulnd pe partea de
server (nucleul AJAX, utiliznd obiecte dedicate, fiind implementat n JavaScript);
- DHTML (Dynamic HTML) permite o actualizare dinamic a paginii, punnd la
dispoziie elemente dinamice HTML gen DIV, SPAN lucrnd integrat cu HTML;
- DOM (Document Object Model) utilizat (prin intermediul JavaScript)
pentru a conlucra att cu structura HTML (prin evenimente ataate), ct i (dac
este cazul) cu datele XML returnate de server;
- XML (eXtensible Markup Language)- utilizat ca format pentru transferul
datelor.
Caracteristicile funcionale principale ale AJAX sunt urmtoarele:
- n momentul n care utilizatorul declaneaz un eveniment (spre exemplu, o
apsare de buton), o secven de cod JavaScript i DHTML poate actualiza imediat
interfaa (sau o zon a acesteia), lansnd o cerere asincron spre server pentru a
trimite / prelua date.
- Dup ce serverul genereaz un rspuns, se poate folosi cod Javascript
(AJAX) i CSS pentru actualizarea interfeei grafice, fr a se face un REFRESH al
ntregii pagini! n momentul n care se ntmpl acest lucru, pagina utilizator
(ecranul) nu clipete, nu dispare sau pierde din vitez, doar o zon bine precizat a
acesteia fiind actualizat (spre exemplu, o zon DIV).
- Caracteristica esenial AJAX const n capacitatea sa de a comunica
asincron cu serverul (utiliznd diverse obiecte specializate, gen XMLHttpRequest

3.2. AJAX

159

sau ActiveXObject), fr a necesita un refresh al ntregii paginii Web. n esen,


AJAX plaseaz tehnologia JavaScript i obiectul specializat (gen XMLHttpRequest) pe
un strat de mijloc, ca liant, ntre componenta client-side (scripturi HTML, CSS,
JavaScript) i componenta server-side (scripturi PHP, Perl, ASP etc.).

3.2.2. PHP cu AJAX


3.2.2.1. Utilizare obiect XMLHttpRequest
Orice aplicaie utiliznd AJAX implic utilizarea unei secvene JavaScript
relativ standard, referit n continuare ca nucleu AJAX, necesitnd instaniere unui
obiect special realiznd comunicaia asincron, bidirecionala, cu serverul Web (mai
precis, cu scripturi rulnd server-side). Funcie de tipul de browser apelant, exist
mai multe astfel de obiecte. Astfel, clasa XMLHttpRequest este folosit pentru
browsere ale familiilor Mozilla-Firefox,. Safari, Opera, respectiv clasele bazate pe
ActiveXObject - pentru familia Internet Explorer (cu parametri chiar diferii, funcie
de versiunea browser-ului).
Pentru o simpl exemplificare a integrrii unui nucleu AJAX ntr-o pagin Web,
se consider o aplicaie de apelare asincron (AJAX) a unui script PHP care permite
afiarea automat, la declanarea unui anumit eveniment, a momentului de timp
curent (preluat de pe serverul Web). Din motive de realizare a unei simple
comparaii ntre un apel clasic, respectiv un apel AJAX, se va prevedea o afiare a
momentului de timp curent, att la ncrcarea paginii printr-un apel clasic (acesta
fiind actualizat doar la ncrcarea paginii sau la un refresh explicit al acesteia),
respectiv o a doua afiare (ntr-o caset a unui formular) declanat de un
eveniment, afiarea fiind asincron i nu necesit un refresh al ntregii pagini Web.
Figura 3.7 prezint cele dou afiri comparative ale timpului: una static iniiat
doar de ncrcarea paginii, cealalt dinamic, actualizat asincron la apariia unui
anumit eveniment declanator (folosind AJAX)
Structural, o aplicaie AJAX conine un script rulnd pe partea de client,
integrnd cod HTML-JavaScript (inclusiv nucleul AJAX), realiznd un apel al unui al
doilea script rulnd server-side (n cazul de fa, serverTime.php), dup cum s-a
mai precizat. n exemplificarea curent, din motive de tratare comparativ a celor
dou tipuri de apeluri (clasic/AJAX), n primul script se prevede, n aceiai pagin, i
o afiare iniial, static, necesitnd un apel clasic al unui script PHP (din acest
motiv, fiierul referit are extensia PHP, i nu HTML cum ar fi uzual).
Structura acestui fiierul apel.php (rulnd majoritar -ca i cod- pe partea
de client) conine:
- funcia JavaScript ajaxFunction, coninnd practic nucleul AJAX (integrat n orice
aplicaie AJAX), genernd prin instaniere un obiect de comunicaie asincron cu
serverul, specific fiecrui tip de browser (din clasa XMLHttpRequest,spre exemplu
pentru Mozilla, sau diverse versiuni de ActiveX-uri pentru Internet Explorer) [16].
- codul aferent comunicaiei bidirecionale propriu-zise utiliznd obiectul anterior
instaniat (numit aici ajaxRequest), realiznd apelul asincron al unui script rulnd
server-side, prin utilizarea unor funcii/metode/proprieti specifice acestuia:
- onreadystatechange eveniment stocnd funcia care proceseaz
rspunsul serverului (ce se ntmpl cnd rspunsul serverului este gata s fie
procesat);

160 ELEMENTE DE JAVASCRIPT I AJAX - 3


- readyState proprietate stocnd starea rspunsului serverului (0- cerere
neiniializat, 1-cerere nesetat, 2 -cerere trimis, 3-cerere n procesare, 4cerere complet)
- responseText metod permind
preluarea datelor returnate ca
rspuns de ctre server (n exemplul de fa, acestea fiind pasate spre documentul
curent coninnd formularul MyForm, respectiv spre caseta time, ca i coninut value
al acesteia).
- open i send ca metode utilizate pentru trimiterea cererii spre server
(apelul, eventual parametrizat al scriptului rulnd server-side). Prima metod are
trei parametrii: metoda folosit (GET sau POST), adresa scriptului apelat de pe
partea de server, iar ultimul parametru stabilete dac cererea este asincron sau
nu. A doua metod efectueaz cererea propriu-zis, pasnd i eventualii parametri,
dac este cazul (pentru metoda GET, parametrul acesteia este tot timpul null).

Fig.3.7. Afiare dinamic timp

Codul fiierului apel.php, integrnd secvena AJAX, este urmtorul:


<html> <body>
<script language="javascript" type="text/javascript">
//Creare NUCLEU AJAX asigurare compatibilitate browser
function ajaxFunction(){
var ajaxRequest;
// variabila obiect Ajax
try{
// Opera 8.0+, Firefox, Safari
ajaxRequest = new XMLHttpRequest();
} catch (e){
// Internet Explorer
try{
ajaxRequest = new ActiveXObject("Msxml2.XMLHTTP");
} catch (e) {
try{
ajaxRequest = new ActiveXObject("Microsoft.XMLHTTP");
} catch (e){
alert("Eroare");
return false;
}

3.2. AJAX

161

}
}
// Funcie care preia date de la server Web
ajaxRequest.onreadystatechange = function(){
if(ajaxRequest.readyState == 4)
document.myForm.time.value = ajaxRequest.responseText;
}
//Apel i pasare date spre server Web
ajaxRequest.open("GET", "serverTime.php", true);
ajaxRequest.send(null);
}
</script>
<form name='myForm'>
Name: <input type='text' onBlur="ajaxFunction()" name='username' /> <br />
<b>Afisare cu AJAX</b><br>
Time: <input type='text' name='time' />
</form>
<b>Afisare fara AJAX </b><br>
<?php include 'serverTime.php'; ?>
</body>
</html>
Partea de cod clasic HTML-JavaScript, implementeaz un formular cu dou
casete INPUT, prsirea primei casete (evenimentul onblur, echivalentul lui onLeave
din alte limbaje) conducnd (prin apelul funciei AJAX aferente ajaxFunction) la
completarea n cea de-a doua caset a timpului citit de pe server, prin apelul
asincron implicit al scriptului rulat pe partea de server serverTime.php:.
<?php
echo date("H:i:s");
?>
Apelul asincron putea fi declanat i la un eveniment onClick chiar pe caseta
a doua n care se afieaz timpul, dar n acest caz aplicaia va reaciona doar la un
eveniment declanat strict de mouse (nu i de tastatur):
<input type='text' name='time' onClick="ajaxFunction()" />
Exemplul anterior permite apelul asincron i refresh-ul datelor afiate ntr-un
element de tip caseta INPUT. n unele situaii ns, se dorete refresh-ul unei zone
bine delimitate de pe ecran, spre exemplu utiliznd o etichet de tip DIV. n acest
caz, n partea de cod HTML (eliminndu-se caseta INPUT time), dup formular se
poate prevedea o astfel de zon DIV (cu un ID bine precizat, prin care aceasta poate
fi referit):
<div id="Elem_DIV"><b> <?php include 'serverTime.php'; ?></b><br></div>
De asemenea, codul JavaScript pentru referirea zonei DIV de afiare/refresh
implic urmtoarea modificare aferent metodei AJAX (responseText) care
intercepteaz i proceseaz rspunsul serverului:
ajaxRequest.onreadystatechange = function()
{
if(ajaxRequest.readyState == 4)
document.getElementById('Elem_DIV').innerHTML=
ajaxRequest.responseText;
}

162 ELEMENTE DE JAVASCRIPT I AJAX - 3


Se poate remarca modul specific de referire pentru ncrcarea cu date a
unui element DIV, comparativ cu un element INPUT:
Caseta INPUT
document.myForm.time.value=. . .
(name=time)
Element DIV
document.getElementById('Elem_DIV').innerHTML=. . .
(ID=Elem_DIV)
Eticheta HTML DIV este de regul cea mai folosit pentru implementarea
unei zone limitate de afiare i actualizare asincron folosind AJAX, aa dup cum se
va putea observa i n exemplele urmtoare.
Exemplul de fa realizeaz un apel asincron, folosind metoda GET, fr
pasare de parametri. Asupra modului de folosire i al metodei POST, respectiv
asupra modului de pasare de parametri ai apelului, se va reveni n exemplificrile
din paragrafele ulterioare.

3.2.2.2. Grafic dinamic cu AJAX


Una dintre aplicabilitile cele mai des uzitate ale AJAX-ului este cea de afiare
dinamic, ntr-o zon cu rol de header al unei pagini Web, a unei informaii
multimedia destinat reclamei (schimbarea fcndu-se automat i aleator).
Exemplificarea de fa consider o afiare a unui ceas marcnd timpului curent
(preluat de pe host-ul serverului Web), respectiv a unor imagini ntr-o ordine
aleatoare, aciunea desfurndu-se ntr-o zon DIV a paginii Web (vezi comparativ
fig. 3.8.a i 3.8.b).

Fig.3.8.a Grafic dinamic (o zon DIV dinamic, dou zone DIV statice)

Evident c simpla afiare aleatoare a unor imagini (crend un efect de


dinamic), se poate realiza i folosit doar cod JavaScript clasic. Avantajul major
oferit de AJAX (care impune utilizarea lui ntr-o astfel de situaie) const n faptul c
dinamica generat de acesta nu implic un refresh al ntregii pagini Web (cu efecte
negative privind viteza de ncrcare, clipirea coninutului, momente de ntrerupere
a operrii n pagin n ateptarea rencrcrii etc.), ci doar o rencrcare a zonei DIV

3.2. AJAX

163

referite (n plus, aceasta fcndu-se i asincron, fr generare de sincope n zona


util de lucru a paginii).

Fig.3.8.b Grafic dinamic (doar coninutul primului DIV s-a modificat)

Aplicaia considerat pentru exemplificare conine urmtoarele elemente:


Trei zone de afiare DIV (pentru a demonstra refresh-ul doar pe o zon a
paginii Web). n primul DIV (plasat n celula unui tabel pentru a limita dimensiunile
lui) se ncrc periodic (printr-un apel asincron AJAX la intervale de 1 sec.) timpul
citit de pe server, respectiv un set aleator de cte dou imagini (situaie des
ntlnit pentru afiarea dinamic aleatoare a unor reclame ntr-o zona header a
unor site-uri). Al 2-lea i al 3-lea DIV sunt folosite pentru simple exemplificri ale
faptului c restul paginii rmne static (nu se face refresh), respectiv exemplificri
ale modului de design/stilizare pentru un element DIV. Se poate observa c designul
i dimensiunile unui DIV se pot seta doar folosind CSS. Un DIV simplu (fr alte
setri de atribute fcute prin CSS) ocup ntreaga lime a paginii (nlimea fiind
dat de dimensiunea coninutului lui sau de modul de spaiere al acestuia).
Codul aferent aplicaiei este urmtorul:
<html>
<body>
<table border='1'>
<tr><td>
<div style="color:#0000FF; font-size: 30; background-color:#B3B3B3;"
id='ajaxDiv'>Diviziunea 1</div>
</td>
<td>
<form name='myForm'>
<b>Zona de lucru </b><br>
Name: <input type='text' onBlur="ajaxFunction()" name='username' /> <br />
Time: <input type='text' name='time' />
</form>
</td></tr>

164 ELEMENTE DE JAVASCRIPT I AJAX - 3


</table>
<b>Afisare fara AJAX </b><br>
<div style="display:inline-block; color:#0000FF; font-size: 30; backgroundcolor:#B3B303; width: 70%; width: 70%; height: 300px" id='ajaxDiv1'>
<?php include 'serverTime.php'; ?>
</div>
<div style="color:#0000FF; font-size: 30; background-color:#B3B3B3;"
id='ajaxDiv2'>Alt div</div>
</body>
</html>
<script language="javascript" type="text/javascript">
function ajaxFunction()
{
var ajaxRequest;
try{
// Mozilla, Opera 8.0+, Firefox, Safari
ajaxRequest = new XMLHttpRequest();
} catch (e){
// Internet Explorer
try{
ajaxRequest = new ActiveXObject("Msxml2.XMLHTTP");
} catch (e) {
try{
ajaxRequest = new ActiveXObject("Microsoft.XMLHTTP");
} catch (e){
alert("Your browser broke!");
return false;
}
}
}
// Funcie de recepie
ajaxRequest.onreadystatechange = function()
{
if(ajaxRequest.readyState == 4)
{
var ajaxDisplay = document.getElementById('ajaxDiv');
ajaxDisplay.innerHTML = ajaxRequest.responseText;
setTimeout('ajaxFunction()',10000);
// reamorsare periodica
}
}
ajaxRequest.open("GET", "serverTime.php", true);
ajaxRequest.send(null);
}

3.2. AJAX

165

//startare prima oar la apel pagin (eveniment-apel pagin)


ajaxFunction();
</script>
Ca i n exemplul precedent, n momentul n care cererea este complet
(ajaxRequest.readyState == 4), DIV-ului identificat prin id i se trimite rspunsul
cererii asincrone, i totodat se restarteaz un timer (setTimeout) care va
redeclana (reamorsa) funcia AJAX dup un interval de 10 secunde:
setTimeout('ajaxFunction()',10000);
Apelul explicit n scriptul JavaScript al funciei ajaxFunction() conduce la o
prima rulare n momentul ncrcrii paginii.
Scriptul PHP (serverTime.php) apelat si rulat pe partea de server are codul
urmtor:
<?php
$var1=rand(1,5);
//generare numere aleatoare ntregi in interval [1,5]
$var2=rand(1,5);
echo date("H:i:s"); //timp server Web
echo "&nbsp";
// este necesara existena a 5 imagini cu numele 1.jpg, 2jpg,.,5.jpg
echo "<img src='".$var1.".jpg'"." height='200' weight='200' >";
//ncrcare imagine
echo "&nbsp";
//spaiu ntre cele dou imagini
echo "<img src='".$var2.".jpg'"." height='200' weight='200' >";
?>
Scriptul PHP practic genereaz numere aleatoare n intervalul [1,5] i
rspunde/returneaz ora curent, respectiv cte dou imagini selectate aleator
dintr-un set predefinit. Rulnd aplicaia se poate remarca c doar coninutul primului
DIV se modific, fr a afecta restul paginii (practic doar coninutul celulei tabelului
n care este plasat primul DIV).
n plus, s-a prevzut un apel manual al funciei AJAX (conducnd la o
refresh-are imediat a timpul i a imaginilor afiate) la un eveniment onBlur ataat
unei casete INPUT (declanarea fcndu-se la prsirea acestei casete).
Deoarece transferul printr-o metod GET cu AJAX nu funcioneaz pe
Internet Explorer, utilizarea metodei POST (permind funcionarea i pe Internet
Explorer) implica urmtoarea modificare de cod a funciei AJAX:

// Functie de receptie
ajaxRequest.onreadystatechange = function()
{
if(ajaxRequest.readyState == 4)
{
var ajaxDisplay = document.getElementById('ajaxDiv');
ajaxDisplay.innerHTML = ajaxRequest.responseText;
setTimeout('ajaxFunction()',1000);
}
}

166 ELEMENTE DE JAVASCRIPT I AJAX - 3


ajaxRequest.open("POST", "serverTime.php", true);
var params ="";
//nu sunt parametri de transmis
http.setRequestHeader("Content-type", "application/x-www-formurlencoded");
http.setRequestHeader("Content-length", params.length);
http.setRequestHeader("Connection", "close");
ajaxRequest.send(params);
}
Observaie:
Dac la un apel AJAX cu parametri, folosind metoda GET, codul aferent utilizat
este de forma:
var params = "? "+"par1=" + var1 + "&par2=" + var2;
ajaxRequest.open("GET", "ajax-example.php" + params, true);
ajaxRequest.send(null);
trecerea la metoda POST implic o construcie a un string cu parametri de transmis
de forma (atenie la ?):
var params = "par1=" + var1 + "&par2=" + var2;

3.2.3. AJAX, PHP i MySQL aplicaii


3.2.3.1. Preliminarii
Obiectivul paragrafului de fa este de a oferi o descriere privind modul de
integrare a unui nucleu AJAX (secven AJAX)) n contextul unei aplicaii PHP
opernd cu baze de date MySQL. Figura 3.9 prezint o imagine privind interaciunile
dintre diversele componente implicate, privite din punct de vedere
al
funcionalitilor acestora, respectiv al tipului de cod folosit, rulnd fie pe partea de
client, fie pe partea de server (Web, respectiv MySQL).
Ca i n exemplul precedent, codul executat pe parte de client integreaz
secvenele HTML, respectiv JavaScript (n principal, nucleul de cod AJAX), afind pe
ecran o interfa HTML iniial i eventual reacionnd (bazat pe secvenele
JavaScript) la diverse evenimente. n urma unui apel HTTP al scriptului HTML (vezi
conexiunea [A] n fig. 3.9), acesta este ncrcat i executat pe partea de client
(browser). Un eveniment (onClick, onMouseMove, etc.) este interceptat de
secvenele JavaScript care apeleaz nucleul AJAX, lansnd un apel asincron spre un
script PHP localizat pe server (vezi conexiune [B] n fig. 3.9). Componenta AJAX
poate s paseze i parametri n cadrul acestui apel asincron. Execuia server-side a
scriptului PHP (interacionnd cu MySQL) genereaz un rezultat ca rspuns, acesta
putnd fi trimis i folosit att de scriptul iniial HTML-AJAX (de exemplu pentru
regenerarea/umplerea cu date a unor componente HTML interactive -vezi conexiune
[B1]), ct i de ctre o secven HTML de afiare a rezultatelor (spre exemplu o
zon DIV - vezi conexiune [B2]) - permind o afiare de informaii, fr o
rencrcare a ntregii pagini Web (refresh doar pe zona DIV).

3.2. AJAX

Client
(Browser)
Apel HTTP (web)
[A]

167

Server
(WEB)
Script HTML +
JavaScript

Script HTML +
apel AJAX
Script PHP
JavaScript
(+HTML)
Eveniment
(onClick,
[B1]
onMouseMove, etc)
[B]
[B2]
MySQ
DATE
L
(tag DIV)

Fig.3.9. Apel WEB cu AJAX (+PHP+MySQL)

Exemplificrile din paragrafele urmtoare vor urmri cteva scenarii posibil a


apare n diverse aplicaii, abordnd gradat inclusiv probleme de codare specifice
operrii n acest triplet AJAX-PHP-MySQL, astfel:
- interogare automat a unei tabele MySQL (printr-un apel asincron periodic din
partea secvenei AJAX), afiarea datelor returnate n pagina Web fcndu-se fr
refresh-ul ntregii pagini Web (ca i cod, nucleul AJAX fcnd un apel asincron fr
parametri spre server)
- interogare cu parametri a unei baze de date, acetia fiind preluai iniial de
secven AJAX i pasai spre scriptul PHP apelat asincron, asigurndu-se de
asemenea o actualizare a datelor de afiat, fr rencrcarea ntregii pagini (noua
problem de codare tratat fiind cea de realizare a unui apel AJAX asincron
parametrizat).
- interogare cu parametri a unei baze de date, apelul asincron fiind parametrizat ca
i n cazul anterior menionat, datele returnate de scriptul PHP de pe server fiind
utilizate pentru regenerarea i umplerea cu date a unor elemente HTML interactive
(casete SELECT), fr refresh-ul ntregii pagini (apelurile asincrone repetate dup
fiecare eveniment-selecie oferind o interactivitate i dinamic sporit, apropiat de
cea a unei aplicaii desktop).
Pentru aplicaiile din paragrafele urmtoare se consider tabela tabel1
(stocat n baza de date MySQL cu numele BAZA), creat cu comanda:
CREATE TABLE tabel1 (
nume varchar(20) primary key,
varsta int(3) NOT NULL,
sex varchar(1) NOT NULL,
salar int(5) NOT NULL
);

168 ELEMENTE DE JAVASCRIPT I AJAX - 3

3.2.3.2. Interogare cu actualizarea unei zone de afiare DIV


Exemplificarea de fa are drept obiective funcionale urmtoarele:
- interogarea automat, periodic (la intervale de timp prestabilite), a unei tabele
MySQL, printr-un apel asincron realizat de ctre o secven AJAX;
- afiarea n pagina Web a coninutului actualizat periodic al tabelei bazei de date,
ntr-o zon DIV, doar ea fiind actualizat constant, fr a se face un refresh al
ntregului coninut al paginii Web.
Din punct de vedere tehnic, cazul de studiu considerat prezint o soluie de
codare asigurnd o preluarea i afiare/reafiare a rezultatelor tabelate ale
interogrii ntr-o zon DIV (doar aceast poriune a paginii Web fiind supus unui
refresh periodic).
Aplicaia ncarc iniial n dou zone tabelate datele tabelei MySQL, una
dintre zone fiind supus la intervale regulate unui refresh (n exemplul considerat, la
intervale de 10 sec.), surprinznd implicit o eventual modificare a coninutului
tabelei (fig.3.10). Se poate remarca c actualizarea celeilalte zone (fr AJAX) nu se
face dect n cazul unui refresh explicit al ntregii paginii Web (exact ceea ce dorete
s evite tehnologia AJAX, pentru o sporire a vitezei i dinamicii aplicaiei).
Codul aplicaiei, prezentat i comentat n continuare, conine dou scripturi:
- un script HTML-JavaScript (fiierul Start.PHP) integrnd secvena AJAX propriuzis (rulnd client-side), coninnd i o comand singular PHP (rulnd server-side),
executat doar o singur dat la apelul scriptului i introdus n exemplul de fa
doar pentru o simpl comparaie privind interogarea/afiarea datelor cu, respectiv
fr AJAX.
- un script PHP (fiier ajax-example1.php, rulnd server-side), interacionnd cu
baza de date MySQL i apelat asincron (fr parametri n scenariul de fa) de ctre
nucleul de cod AJAX (acesta la rndul lui startat de o secven timer).
Funcia JavaScript Ajax, incluznd secvena AJAX, este aproape similar cu
cea din exemplul anterior (ajaxFunction). Secvena nucleu AJAX precizeaz n plus
locaia DIV spre care este trimis rspunsul script-ului PHP, asigurnd o zon de
afiare supus doar ea unei actualizri periodice (i nu ntreaga pagin Web:
document.getElementById('Elem_DIV').innerHTML=
xmlHttp.responseText;
Codul JavaScript conine de asemenea o secven pornit automat la
ncrcarea paginii Web (window.onload), scopul ei fiind cel de amorsare a unui codtimer pentru declanarea iniial temporizat a nucleului AJAX:
setTimeout('Ajax()',10000);
Linia anterioar de cod se regsete i n nucleul AJAX, apelul ei asigurnd o
reamorsare temporizat a timer-ului. Pe baza celor precizate, prima interogare a
tabelei se realizeaz doar dup 10 secunde de la ncrcarea paginii, fiind repetat
cu periodicitatea acestui interval. Dac se dorete o prim interogare chiar n
momentul ncrcrii paginii, un apel direct, netemporizat, al funciei Ajax() poate fi
fcut explicit (vezi linia comentat din codul scriptului).
Ca zon de afiare a rspunsului scriptului PHP apelat asincron de nucleul
AJAX, respectiv reafiare i refresh al datelor, s-a definit (prin cod HTML) un
element DIV (identificat prin atributul id="Elem_DIV").
Observaie: Comanda JavaScript setTimeout permitere a startare temporizat a unei
funcii JavaScript, aceasta executndu-se o singur dat, dup expirarea
temporizrii setate (n milisecunde).

3.2. AJAX

169

Afiare
(interogare
PHP)- fr AJAX (nu se
face Refresh!)
Afiare (interogare
PHP)- cu AJAX (Refresh
periodic, automat, doar
a zonei DIV)

Fig.3.10. Interogare tabel cu i fr AJAX

Codul scripturilor anterior referite este prezentat i comentat n continuare.


Fiier Start.PHP:
<html> <body>
<!-- Fr AJAX nu se va face refresh automat!!!- pagina se va ncrca doar o dat,
vizualiznd coninutul static al tabelei n momentul ncrcrii paginii (dubla afiare
-->
<?php
// Cod doar pentru a demonstra c nu se face refresh la ntreaga pagin
include 'ajax-example1.php';
//cod PHP
?>
<script type="text/javascript">
//Nucleul AJAX
function Ajax()
{
var xmlHttp;
try
{
// Firefox, Opera 8.0+, Safari
xmlHttp=new XMLHttpRequest();
}
catch (e){
try
{
// Internet Explorer
xmlHttp=new ActiveXObject("Msxml2.XMLHTTP");
}

170 ELEMENTE DE JAVASCRIPT I AJAX - 3


catch (e)
{
try
{
xmlHttp=new ActiveXObject("Microsoft.XMLHTTP");
}
catch (e)
{
alert("No AJAX!?");
return false;
}
}
}
//Preluare date returnate de server
xmlHttp.onreadystatechange=function(){
if(xmlHttp.readyState==4)
{
document.getElementById('Elem_DIV').innerHTML=
xmlHttp.responseText;
setTimeout('Ajax()',10000); // (Restartare timer i refresh)
}
}
xmlHttp.open("GET","ajax-example1.php",true);
xmlHttp.send(null);
}
//Final nucleu AJAX
// Tot cod JavaScript:
// Dac se dorete ncrcare zona AJAX chiar la momentul 0 (altfel va
// porni dup 10 sec.)
//Ajax();
// Startare timer la ncrcare pagin
// Eveniment declanator timer
window.onload=function()
{
setTimeout('Ajax()',10000);
}
</script>
<!-- Cod HTML - Elem_DIV-elementul de legtur HTML-JavaScript-->
<div id="Elem_DIV"><b> Default text</b><br></div>
</body> </html>
Scriptul PHP apelat asincron i rulnd pe partea de server, realizeaz o
interogare (neparametrizat) a unei tabele MySQL i afiare tabelat a datelor
(fiind un script clasic PHP-MySql, al crui rspuns este preluat de nucleul AJAX i
pasat spre zona de afiare DIV, fr a afecta restul coninutului paginii Web care
rmne static, eliminndu-se astfel efectul de clipire al unui refresh asupra
ntregii pagini Web):
Fiier ajax-example1.php:
<?php
$host = "localhost";

3.2. AJAX

171

$user = "root";
$pass = "parola";
$baza = "baza";
//Conectare la server i selectare baz de date
mysql_connect($host, $user, $pass);
mysql_select_db($baza) or die(mysql_error());
$query = "SELECT * FROM tabel1 order by nume";
$result = mysql_query($query) or die(mysql_error());
//Afiare cap tabel
$sir= "<table border=1>";
$sir .= "<tr>";
$sir .= "<th>Nume</th>";
$sir .= "<th>Varsta</th>";
$sir .= "<th>Sex</th>";
$sir .= "<th>Salar</th>";
$sir .= "</tr>";
// Afiare date
while($row = mysql_fetch_array($result)){
$sir .= "<tr>";
$sir .= "<td>$row[0]</td>";
$sir .= "<td>$row[1]</td>";
$sir .= "<td>$row[2]</td>";
$sir .= "<td>$row[3]</td>";
$sir .= "</tr>";
}
echo "Interogare: " . $query . "<br />";
$sir .= "</table>";
echo $sir; ?>
Observaie: n mod normal fiierul Start.PHP nu trebuia s includ cod PHP
(motivele au fost expuse deja, fiind vorba de o simpl exemplificare comparativ
ntre modul de interogare i afiare clasic, respectiv modul bazat pe folosirea unui
apel asincron JavaScript + AJAX). Fr secvena de cod PHP, coninnd doar cod
HTML i JavaScript, numele fiierului putea fi Start.HTML.
Aplicaia prezentat, n care secvena AJAX apeleaz scriptul PHP serverside folosind metoda GET, funcioneaz doar pe browsere din familia Mozilla (pe
Internet Explorer, AJAX cu GET nu funcioneaz). Prin schimbarea metodei de apel
n POST, funcionalitatea acesteia este extins i pentru browserele familiei Internet
Explorer. Aceast schimbare, din punct de vedere al codului JavaScript aferent
nucleului AJAX, implic nlocuirea secvenei de cod urmtoare (specifice metodei
GET):
xmlHttp.open("GET","ajax-example1.php",true);
xmlHttp.send(null);
cu urmtoarea secven de cod aferent metodei POST:
var params = "";
// string vid de parametri
xmlHttp.open("POST","ajax-example1.php",true);
xmlHttp.setRequestHeader("Content-type", "application/
x-www-form-urlencoded");
xmlHttp.setRequestHeader("Content-length", params.length);

172 ELEMENTE DE JAVASCRIPT I AJAX - 3


xmlHttp.setRequestHeader("Connection", "close");
xmlHttp.send(params);
n principiu, noua secven seteaz string-ul cu parametri ai apelului (n cazul
de fa, string-ul este vid, neexistnd parametri), respectiv realizeaz o transmitere
explicit a lui, chiar dac este vid (folosind xmlHttp.send). n plus, trebuie setai
parametri header-ului necesar pentru un transfer i apel prin metoda POST. [32]

3.2.3.3. Interogare parametrizat a unei tabele MySQL


Pornind de la exemplul precedent, urmtorul scenariu const ntr-o
exemplificarea a modului n care se utilizeaz AJAX pentru un transfer de parametri
la apel (i deci implicit, pentru o interogarea parametrizat a tabelei bazei de date
MySQL). Exemplul AJAX anterior a permis un apel asincron pentru interogarea unei
tabele MySQL, fr folosirea de parametri de interogare (trimii spre scriptul rulnd
pe partea de server). Exemplul curent urmrete prezentarea unei modaliti de
comunicaie asincron cu un transfer de parametri. [31] Astfel, dup
completarea/selecia datelor de intrare folosind un formular HTML, la apsarea
butonului formularului parametri de apel sunt transferai, ntr-o prim etap, spre
codul JavaScript aferent nucleu AJAX, acesta repasndu-i asincron spre scriptul PHP
localizat pe server.
Acest script realizeaz interogarea parametrizat a tabelei MySQL i
returneaz un rezultat spre secven AJAX. Tot secvenei AJAX i revine sarcina de
a dirija acest rezultat spre zona de afiare precizat printr-un element HTML DIV,
fr a se face un refresh al formularului i implicit al ntregii pagini Web (doar zona
DIV fiind cea actualizat). Figura 3.11 prezint rezultatul interogrii asincrone, doar
zona de afiare a datelor returnate (DIV) fiind actualizat la apsarea butonului
formularului.

Fig.3.11. Interogare parametrizat

3.2. AJAX

173

Se poate observa existena a trei parametri de intrare (dou elemente


INPUT i un SELECT). Preluarea valorilor acestor parametri i transferul lor spre
variabile JavaScript se face cu comanda de genul:
var variabila1 = document.getElementById('identificator_element').value;
n continuare se construiete string-ul folosit de o metoda GET pentru
transferul de parametri, iar apelul asincron al scriptului PHP rulnd pe partea de
server se face integrnd i acest string cu parametri (vezi funcia
ajaxRequest.open). Aplicaia folosete n mare msura codul aferent exemplului
anterior, cu urmtoarele modificri:
- se construiete formularul HTML adecvat prelurii parametrilor de la tastatur i
apelnd funcia AJAX (existnd precizat o zona DIV de afiare a rezultatului,
singura din pagina Web reactualizat):
- se completeaz nucleul AJAX cu secvena de cod destinat prelurii parametrilor
din formularul HTML:
var varsta = document.getElementById('varsta').value;
var salar = document.getElementById('salar').value;
var sex = document.getElementById('sex').value;
- se creeaz string-ul de interogare pasat (asincron i cu GET) de ctre nucleul
AJAX spre scriptul PHP apelat, executat pe server i realiznd interogarea efectiv a
tabelei MySQL:
var queryString = "?varsta=" + varsta + "&salar=" + salar + "&sex=" +
sex;
ajaxRequest.open("GET", "ajax-example.php" + queryString, true);
ajaxRequest.send(null);
- scriptul PHP este adaptat corespunztor prelurii acestor parametri primii de la
secvena AJAX i realizrii interogrii SQL parametrizate.
Codul complet aferent acestui scenariu aplicativ este prezentat n
continuare:
Start.html:
<html><body>
<script language="javascript" type="text/javascript">
function ajaxFunction(){
var ajaxRequest;
try
{
// Mozilla, Opera 8.0+, Firefox, Safari
ajaxRequest = new XMLHttpRequest();
}
catch (e){
// Internet Explorer
try{
ajaxRequest = new ActiveXObject("Msxml2.XMLHTTP");
} catch (e) {
try{
ajaxRequest = new ActiveXObject("Microsoft.XMLHTTP");
} catch (e){
// Eroare
alert("Eroare!");
return false;
}

174 ELEMENTE DE JAVASCRIPT I AJAX - 3


}
}
// creare funcie primind date de la server Web
ajaxRequest.onreadystatechange = function()
{
if(ajaxRequest.readyState == 4){
var ajaxDisplay = document.getElementById('ajaxDiv');
ajaxDisplay.innerHTML = ajaxRequest.responseText;
}
}
// Transfer parametrispre server i apel asincron
var varsta = document.getElementById('varsta').value;
var salar = document.getElementById('salar').value;
var sex = document.getElementById('sex').value;
// Creare string interogare
var queryString = "?varsta=" + varsta + "&salar=" + salar +
"&sex=" + sex;
ajaxRequest.open("GET", "ajax-example.php" + queryString, true);
ajaxRequest.send(null);
}
</script>
<form name='myForm'>
Max varsta: <input type='text' id='varsta' /> <br />
Max salar: <input type='text' id='salar' />
<br />
Sex: <select id='sex'>
<option value='m'>m</option>
<option value='f'>f</option>
</select>
<input type='button' onclick='ajaxFunction()' value='Query MySQL' />
</form>
<div id='ajaxDiv'>Afisare rezultate </div>
</body></html>
Codul scriptului PHP (ajax-example.php) apelat asincron de ctre nucleul
AJAX este urmtorul:
<?php
$dbhost = "localhost";
$dbuser = "root";
$dbpass = "parola";
$dbname = "baza";
mysql_connect($dbhost, $dbuser, $dbpass);
mysql_select_db($dbname) or die(mysql_error());
$varsta = $_GET['varsta'];
$sex = $_GET['sex'];
$salar = $_GET['salar'];

3.2. AJAX

175

// prevenire SQL Injection


$varsta = mysql_real_escape_string($varsta);
$sex = mysql_real_escape_string($sex);
$salar = mysql_real_escape_string($salar);
$query = "SELECT * FROM tabel1 WHERE sex = '$sex'";
if(is_numeric($varsta))
$query .= " AND varsta <= $varsta";
if(is_numeric($salar))
$query .= " AND salar <= $salar";
$qry_result = mysql_query($query) or die(mysql_error());
$display_string
$display_string
$display_string
$display_string
$display_string
$display_string
$display_string

= "<table border=1>";
.= "<tr>";
.= "<th>Nume</th>";
.= "<th>Varsta</th>";
.= "<th>Sex</th>";
.= "<th>Salar</th>";
.= "</tr>";

while($row = mysql_fetch_array($qry_result)){
$display_string .= "<tr>";
$display_string .= "<td>$row[nume]</td>";
$display_string .= "<td>$row[varsta]</td>";
$display_string .= "<td>$row[sex]</td>";
$display_string .= "<td>$row[salar]</td>";
$display_string .= "</tr>";
}
echo "Query: " . $query . "<br />";
$display_string .= "</table>";
echo $display_string;
?>
Observaie. Rencrcarea informaiei interogate folosind cod JavaScript i AJAX se
poate face i la apariia altor evenimente ataat unor elemente HTML.Spre exemplu,
n formular poate apare o linie de genul:
Varsta maxima: <input type='text' id='varsta' onmousemove='ajaxFunction()' />
<br />
Sau pentru zona de afiare DIV:
<div id='ajaxDiv' onmousemove='ajaxFunction()'> Afisare rezultate </div>

3.2.3.4. Rencrcare dinamic a etichetelor SELECT aplicaie de


filtrare
Ultima exemplificare prezentat n acest paragraf are drept obiectiv
descrierea unei soluii bazate pe AJAX pentru regenerarea i umplerea dinamic cu
date a unor componente HTML de tip SELECT, utilizate pentru filtrarea succesiv,
prin apeluri asincrone, a coninutului interogat i afiat al unei tabele MySQL.

176 ELEMENTE DE JAVASCRIPT I AJAX - 3

Fig.3.12. Primul apel (ncrcare HTML+JavaScript)

Astfel, se dorete ca n momentul n care se face o selecie (folosind una


dintre casetele de selecie SELECT vezi fig.3.12), acest eveniment s rencarce
succesiv cte o alt caset SELECT cu datele filtrate aferente ei, i totodat, folosind
aceste selecii /filtrri succesive, tabela MySQL este reinterogat (asincron), afiarea
datelor fiind reactualizat corespunztor. Fiecare nou selecie conduce la o filtrare
suplimentar, n timp real (fr a fi necesar un refresh al ntregii pagini Web).

Fig.3.13. Eveniment OnChange pe SELECT sex (SELECT varsta ncrcat interactiv)

n fig. 3.12 se observ cele trei casete SELECT (necompletate nc cu date


deoarece nu s-a realizat nici o selecie, respectiv nici o interogare a tabelei MySQL).
Doar primul SELECT are valori statice (nencrcate din tabela MySQL), celelalte dou
ncrcndu-se dinamic, succesiv, cu date aferente filtrrii anterioare (simultan cu
afiarea tabelat a coninutului filtrat al tabelei vezi fig.3.13, 3.14 i 3.15 ).
La o selecie n prima caseta SELECT (Sex), informaia interogat aferent
seleciei efectuate este afiat, iar urmtoarea caset SELECT (varsta) este la
rndul ei ncrcat cu datele corespunztor filtrate vezi fig.3.13.

3.2. AJAX

177

Fig.3.14. Eveniment OnChange pe SELECT varsta (SELECT nume ncrcat interactiv)

n momentul n care i pe acest al 2-lea SELECT varsta (proaspt ncrcat cu


date din tabela MySQL) se face o selecie, cel de al 3-le SELECT este i el ncrcat cu
date filtrate (iar afiarea tabelat este actualizat) vezi fig.3.14, 3.15.
Evenimentele declanatoare pentru o selecie sunt OnChange. Fiecare nou selecie
duce la o filtrare suplimentar a datelor afiate. Toate operaiile se execut fr o
rencrcare a ntregii pagini Web (prin apeluri asincrone AJAX).

Fig.3.15. Evenimente OnChange (SELECT sex, varsta, nume)

Codul aferent celor dou fiiere script implementnd aplicaia este urmtorul:
Script HTML+JavaScript
<html>
<body>
<script language="javascript" type="text/javascript">
// Secventa AJAX (JavaScript)
// inclusiv identificare tip browser
function ajaxFunction(){

178 ELEMENTE DE JAVASCRIPT I AJAX - 3


var ajaxRequest;
// variabila Ajax
try
{
ajaxRequest = new XMLHttpRequest();
// Firefox, Safari
}
catch (e){
try{
ajaxRequest = new ActiveXObject("Msxml2.XMLHTTP");
} catch (e) {
try{
ajaxRequest = new ActiveXObject("Microsoft.XMLHTTP");
} catch (e){
alert("Eroare AJAX!");
return false;
}
}
}
// creare funcie recepionnd datele trimise de server
ajaxRequest.onreadystatechange = function(){
if(ajaxRequest.readyState == 4){
var ajaxDisplay = document.getElementById('ajaxDiv');
ajaxDisplay.innerHTML = ajaxRequest.responseText;
}
}
// Transfer parametri (3 parametri de filtrare)
var varsta = document.getElementById('varsta').value;
var sex = document.getElementById('sex').value;
var nume = document.getElementById('nume').value;
// Construcie string interogare cu 3 parametri de filtrare
var queryString = "?varsta=" + varsta + "&sex=" + sex +"&nume=" +
nume;
// Pasare parametri spre scrip PHP folosind GET
ajaxRequest.open("GET","ajax-example10.php"+ queryString, true);
ajaxRequest.send(null);
}
</script>
<!--Cod HTML formular selecii -->
<form nume='myForm'>
Sex: <select id='sex' onchange='ajaxFunction()'>
<option value='-'>-</option>
<option value='m'>m</option>
<option value='f'>f</option>
</select>
</form>
<!--Zona DIV pentru actualizare pagin (refresh doar pe aceast zon)-->
<div id='ajaxDiv' >
Varsta mai mica decat: <select id='varsta'></select>
Nume: <select id='nume'></select>

3.2. AJAX

179

</div>
</body></html>
Scriptul anterior afieaz casetele de selecie (vezi fig. 3.12).
Script PHP+HTML - ajax-example10.php realizeaz interaciunea cu MySQL,
pasnd rezultatul spre secvena AJAX.
<?php
$dbhost = "localhost";
$dbuser = "root";
$dbpass = "parola";
$dbnume = "baza";
//Conectare la server i selecie baz de date
mysql_connect($dbhost, $dbuser, $dbpass);
mysql_select_db($dbnume) or die(mysql_error());
// preluare parametri interogare (pasai de scriptul AJAX)
$sex = $_GET['sex'];
$varsta = $_GET['varsta'];
$nume = $_GET['nume'];
//Afisare date (filtrare date tabela MySQL)
//Filtrare iniial doar dup coloana sex (varsta nefiind selectat,
//fiind necesar umplerea SELECT-ului aferent ei!)
$query1 = "SELECT * FROM tabel1 WHERE sex = '$sex' ";
if(is_numeric($varsta))
$query1 .= " AND varsta <= $varsta ";
//Executare interogare
$qry_result =mysql_query($query1) or die(mysql_error());
//Afiare date tabelat (cap tabel, urmat de linii date)
$display_string = "<table border=1>";
$display_string .= "<tr>";
$display_string .= "<th>nume</th>";
$display_string .= "<th>varsta</th>";
$display_string .= "<th>Sex</th>";
$display_string .= "<th>salar</th>";
$display_string .= "</tr>";
while($row = mysql_fetch_array($qry_result))
{
$display_string .= "<tr>";
$display_string .= "<td>$row[nume]</td>";
$display_string .= "<td>$row[varsta]</td>";
$display_string .= "<td>$row[sex]</td>";
$display_string .= "<td>$row[salar]</td>";
$display_string .= "</tr>";
}
$display_string .= "</table>";
echo $display_string;
//afiare linie de date

180 ELEMENTE DE JAVASCRIPT I AJAX - 3


// Umplere tag SELECT varsta
$query = "SELECT * FROM tabel1 WHERE sex = '$sex' order by varsta";
//Execut interogare pentru extragere varsta corespunztoare sex selectat
$qry_result = mysql_query($query) or die(mysql_error());
// Recreare tag nou SELECT varsta cu date aferente ei filtrate dup sex
echo "Varsta mai mica decat: <select id='varsta' onclick='ajaxFunction()'>";
// o nou selecie (eveniment onclick) conduce la o reinterogare a tabelei
// creare opiuni SELECT nou (ncrcare SELECT)
while($row = mysql_fetch_array($qry_result))
{
if ($row[varsta]==$varsta)
echo "<option value='$row[varsta]' selected>$row[varsta]</option>";
else
echo "<option value='$row[varsta]'>$row[varsta]</option>";
}
echo "</select>";
// Umplere tag SELECT nume (filtrate dup sex i varsta)
$query = "SELECT * FROM tabel1 WHERE varsta <= '$varsta' AND sex = '$sex'
order by varsta";
// echo $query;
$qry_result = mysql_query($query) or die(mysql_error());
// creare tag nou SELECT nume
echo "Nume: <select id='nume' onclick='ajaxFunction()' >";
// creare opiuni SELECT nume (ncrcare SELECT)
while($row = mysql_fetch_array($qry_result))
{
if ($row[nume]==$nume)
echo "<option value='$row[nume]' selected>$row[nume]</option>";
else
echo "<option value='$row[nume]' >$row[nume]</option>";
}
?>
Fr a avea pretenia acoperirii ntregii problematici, prezenta suit de
aplicaii AJAX, inclusiv cu baze de date MySQL, a ncercat s puncteze cteva dintre
cele mai ntlnite scenarii de lucru, astfel nct s deschid programatorului o cale
spre complexul domeniu al proiectrii i dezvoltrii acestui gen de aplicaii Web.
Dup cum s-a mai menionat deja, AJAX prezint o serie de avantaje evidente:
(creterea vitezei i a interactivitii site-urilor Web, interfa grafic mult mai
dinamic, etc.). Totui, nu este recomandat un exces de AJAX, existnd i cteva
dezavantaje majore, n special legate de faptul c limbajul JavaScript este
dependent de browser i nu permite o optimizare Web, respectiv motoarele de
cutare nu pot indexa informaii generate dinamic n acest fel.

Bibliografie
1. Ioan Filip - Tehnologii de programare a aplicaiilor Internet cu baze de date,
Editura Orizonturi Universitare, Timioara, 2003.
2. Peter Belesis, Arman Danesh s.a. - Dynamic HTML, Sams.net Publishing,
Indianapolis, USA, 1998.
3. Kris Jamsa, Ken Cope - "Programarea aplicaiilor Internet", Editura All
Educational SA, Bucureti, 1998.
4. Louis Kahn, Laura Logan - "Build Your Own Web Site", Microsoft Press 1996.
5. Jon Duckett - Beginning Web Programming With HTML, XHTML, and CSS, John
Wiley & Sons, 2004.
6. Ian S. Graham - HTML Stylesheet Sourcebook, Wiley, 1997.
7. Brett McLaughlin - What Is HTML5?, O'Reilly Media, 2011.
8. Darren Levy - HTML/CSS / JavaScript: From Beginner to Whiz, Amazon Digital
Services, 2011.
9. Julie Meloni, Michael Morrison - Sams Teach Yourself HTML and CSS in 24
Hours, Sams, 2009.
10. Stig Sther Bakke, Alexander Aulbach s.a. -PHP Manual, PHP Documentation
Group (http://www.php.net/docs.php), 2003.
11. MySQL 5.0 Reference Manual (dev.mysql.com/doc/refman/5.0/en/), 2012.
12. Kevin Yank - Build Your Own Database Driven Web Site Using PHP & MySQL,
Copyright 2009 SitePoint Pty. Ltd., USA, 2009.
13. Ioan Filip - Sisteme de gestiune a bazelor de date, Editura Orizonturi
Universitare, Timioara, 2007.
14. Ethan Cerami - Web Services Essentials, O'Reilly Media, 2002.
15. Adam Trachtenberg, David Sklar - PHP Cookbook, O'Reilly Media, 2006.
16. Phill Ballard -AJAX n lectii de 10 minute, EdituraTeora, Bucuresti, 2007.
17. John Pollock - JavaScript, A Beginner's Guide, Third Edition, McGraw-Hill
Osborne, 2009.
18. Phil Ballard, Michael Moncur - Sams Teach Yourself Ajax, JavaScript, and PHP
All in One, Sams, 2008.
19. www.php.net/
20. php.net/manual/en/index.php
21. www.wampserver.com/en
22. www.zdnet.com/blog/carroll/ajax-vs-desktop-development/1519
23. www.prologue.ro/blog-Web-design/flash-vs-html-5/
24. langpop.com/
25. www.phpromania.net/articol/10/Tipuri_de_date_Variabile_Constante_Operatori_
Definire_functii_.html
26. www.herongyang.com/PHP/php_soap.html
27. blog.claudiupersoiu.ro/2009/05/24/
28. www.scottnichol.com/nusoapintro.htm
29. searchsoa.techtarget.com/definition/object-oriented-programming
30. www.w3schools.com/js/js_intro.asp
31. www.tizag.com/ajaxTutorial/ajax-mysql-database.php

182
32.
33.
34.
35.
36.
37.
38.

Bibliografie
www.openjs.com/articles/ajax_xmlhttp_using_post.php
www.codelifter.com
www.w3schools.com/js/js_events.asp
www.w3schools.com/jsref/dom_obj_event.asp
www.w3schools.com/js/tryit.asp?filename=try_nav_all
www.mysql.com
www.handy-html.com/create-a-simple-css-dropdown-menu/

You might also like