Sunteți pe pagina 1din 61

1.

REALIZAREA SITE-URILOR WEB


Dezvoltarea site-urilor web este o activitate care necesită cunoştinţe din
multiple domenii asociate ariei IT. Este vorba de domeniul ingineriei software, a
reţelelor, a bazelor de date, a securităţii informaţiei şi nu în ultimul rând a
designului.
Documentaţia de faţă îşi propune realizarea unei sinteze aflate la
confluenţa acestor domenii. Scopul este acela de a oferii specialiştilor IT
cunoştinţele necesare pentru a „pune pe picioare” un site web utilizând tehnologii
dezvoltate de firma Microsoft - Internet Information Services, Visual Web
Developer, SQL Server, ASP.NET.
Prima parte a acestui curs (primele 4 secţiuni) se referă elementele de
bază de la care trebuie pornit pentru a dezvolta un site web. Ideea centrală a
acestei părţi este prezentarea unor acţiuni uzuale, care nu necesită scriere de cod
sursă dar care oferă totuşi la final, ca produs finit, un portal web.
Cea de-a doua parte a acestei documentaţii (secţiunile 5-9) oferă accesul
programatorului la controalele ASP.NET de bază. În această manieră, site-ul web
se transformă dintr-o entitate statică într-o entitate dinamică, generată “on the fly”
pe partea de server.
A treia parte a cursului (secţiunile 10-11) extinde facilităţile site-ului prin
oferirea accesului la baze de date rezidente pe server. Astfel este posibilă o
organizare riguroasă a conţinutului paginilor şi o flexibilitate deosebită în ceea ce
priveşte managementul informaţiilor.
Documentaţia se încheie cu prezentarea unor tehnici ASP.NET avansate
(secţiunile 12-14) precum Ajax, servicii web, XML şi WAP.

1
1.1. Configurarea platformei de lucru
În cadrul acestui capitol vor fi abordate elemente care au legătură
tangenţial cu dezvoltarea propriu-zisă a site-ului web. Se oferă răspunsuri
concrete la întrebări precum: Care trebuie să fie setările de pe calculatorul pe care
va fi dezvoltat site-ul? Care este mediul de dezvoltare cu ajutorul căruia va fi
implementat portalul şi cum se configurează acesta?

1.1.1. Virtualizarea platformei de lucru cu ajutorul aplicaţiei Microsoft


Virtual PC
În general, atunci când se dezvoltă un proiect software, este nevoie de
instalarea mai multor aplicaţii specifice. Atunci când numărul de proiecte creşte,
apare problema multitudinii de programe ajutătoare instalate pe calculatorul de
lucru, fapt ce determină o serie de probleme inerente.
În acest context, firma Microsoft a elaborat o serie de soluţii de
virtualizare care permit crearea uneia sau mai multor maşini virtuale pe o aceeaşi
maşină reală. Fiecare emulator creat va utiliza resursele calculatorului fizic şi
poate rula diferite sisteme de operare. De asemenea, fiecare maşină virtuală
rulează în câte o fereastră a sistemului de operare gazdă.
Instalarea softului (sistem de operare şi aplicaţii) pe aceste emulatoare se
realizează în mod identic cu instalarea pe maşini reale, întrucât interfaţa oferită de
maşina virtuală pentru nivelul programelor este identică cu cea oferită de o
maşină reală. De asemenea toate aceste maşini virtuale pot forma o reţea între ele
şi cu calculatorul gazdă, oferindu-se astfel şi conectivitate la Internet în măsura în
care calculatorul real o poate oferi.
Se pot distinge o serie de avantaje ale acestor soluţii de virtualizare:
 calculatorul principal nu este încărcat cu toate programele necesare dezvoltării
proiectelor;
 aplicaţiile pot fi testate practic simultan pe sisteme de operare diferite şi pe
calculatoare cu configuraţii diferite (configuraţia “hardware” a unei maşini
virtuale este setată la crearea ei);
 întrucât toată maşina virtuală (hardware şi software) se află stocată într-un
singur fişier pe calculatorul gazdă, se pot imagina soluţii deosebit de flexibile de
backup;
 un fişier corespunzător unui emulator poate fi salvat pe un suport extern şi astfel
poate fi restaurat pe un alt calculator sau chiar pe calculatorul iniţial atunci când
au apărut probleme (viruşi, erori ale sistemului de operare, etc).
În continuare este prezentată succint aplicaţia de virtualizare Microsoft
Virtual PC oferită gratuit pe site-ul www.microsoft.com.
După instalarea aplicaţiei pot fi create mai multe maşini virtuale, pentru
fiecare precizându-se parametrii tehnici necesari: (numele maşinii virtual – de

2
exemplu “Learn ASP.NET”, cantitatea de memorie RAM rezervată din memoria
internă a calculatorului gazdă, locaţia şi dimensiunea fişierului care va emula
hard-disk-ului virtual) figura 1 -1.

figura 1-1. Crearea unei maşini virtuale utilizând aplicaţia Virtual PC

Ulterior este posibilă instalarea unui sistem de operare pe acest emulator,


pornind de la o imagine ISO a unui CD/DVD sau prin partajarea accesului la
unitatea CD/DVD locală. Aşa cum se observă în Error: Reference source not
found, maşina virtuală poate fi resetată, poate oferi accesul la BIOS-ul propriu şi
suportă rularea aplicaţiilor în fereastra dedicată.

figura 1-2. Exemple de stări ale maşinii virtuale Learn ASP.NET

Un alt aspect foarte important este cel legat de conectivitatea maşinii


virtuale la reţeaua calculatorului real sau chiar la Internet. Dacă maşina gazdă
dispune de mai multe plăci de reţea, una dintre aceste poate fi asignată maşinii

3
virtuale. În caz contrar sau atunci când se doreşte conectarea în reţea a mai multor
maşini virtuale se creează pe calculatorul gazdă mai multe plăci virtuale de tipul
Microsoft Loopback Adapter. După asocierea acestora pe rând cu câte o maşină
virtuală şi după realizarea setărilor corespunzătoare în firewall-urile
calculatoarelor implicate, cele n emulatoare şi gazda sunt în aceeaşi reţea.
Pentru partajarea conexiunii la Internet se utilizează Internet Connection
Sharing, pe calculatorul gazdă şi pe conexiunea care oferă acestuia accesul la
Internet (specificându-se pentru care reţea locală s-a realizat partajarea). Toate
setările TCP/IP pe maşinile virtuale se obţin în mod automat.

1.1.2. Configurarea serverului IIS


Modelul Client-Server presupune existenţa a două aplicaţii, una care
joacă rolul clientului (cere celeilalte anumite resurse) şi alta care joacă rolul
serverului (oferind resursele cerute).
În cadrul unei aplicaţii web, programul server (e.g. Apache, IIS) primeşte
de la programul client (browser) cereri de pagini web sau alte resurse şi le rezolvă
prin trimiterea informaţiilor (fişierelor cerute). Programul server oferit de firma
Microsoft este IIS – Internet Information Services şi face parte dintre
componentele sistemului de operare Windows.
Serverul IIS este implicit dezactivat la instalarea sistemului de operare. El
poate fi activat din Control Panel – Add or Remove Programs – Windows
Components aşa cum indică figura 1 -3.

figura 1-3. Activarea serverului IIS

2
Pentru configurarea serverului IIS se poate utiliza fereastra Computer
Management accesibilă prin alegerea opţiunii Manage din meniul contextual
derulat la clic dreapta pe My Computer. În această fereastră se expandează
Services and Applications şi se alege Internet Information Service - figura 1 -4.

figura 1-4. Accesul la configurarea serverului IIS

figura 1-5. Posibilităţi de configurare ale serverului IIS

Un site web poate fi oprit sau pornit, poate fi configurat să ruleze pe un


anumit port (e.g. 8080) sau într-un anumit folder de bază (e.g. c:\inetpub\
wwwroot). Pentru activarea ASP.NET trebuie aleasă versiunea curentă prin
accesarea tab-ului ASP.NET (figura 1 -5).

3
Schema client-server poate fi extinsă prin includerea unor programe
“interpretoare” pe partea de server (figura 1 -6). În acest context, codul sursă
scris de programator poate conţine anumite scripturi dedicate acestor
interpretoare. Aceste scripturi permit accesul la resurse de pe server (e.g. baze de
date, fişiere) şi generează în mod dinamic cod specific programului client
(HTML, CSS, JavaScript).
SERVER interpretoare
(IIS, Apache) server-side(PHP, ASP)

cerere HTTP resurse (fişiere)

CLIENT plug-in-uri
(IE, Firefox) (flash player, VRML player)
figura 1-6. Schema client-server extinsă

Pentru testarea instalării corespunzătoare a serverului, acesta trebuie testat


prin formularea unor cereri utilizând un program client. Dacă portul de
comunicaţie nu este cel standard pentru protocolul HTTP (80), atunci este
necesară specificarea explicită a sa (http://localhost:8080).

figura 1-7. Accesul la o pagină ASP predefinită a serverului IIS instalat local

Serverul va răspunde prin transmiterea unui fişier implicit (localstart.asp)


aflat în directorul de bază al serverului (c:\inetpub\wwwroot). Afişarea corectă a
unui fişier cu extensia ASP, indică faptul că şi interpretorul pentru scripturile ASP
este instalat şi integrat corespunzător cu serverul IIS (figura 1 -7).

2
1.2. Crearea primului site web utilizând Visual Web Developer

1.2.1. Instalarea şi configurarea serverului SQL şi a Visual Web


Developer
Firma Microsoft a integrat principalele medii de dezvoltare în platforma
numită Microsoft Visual Studio. Pentru dezvoltatorii începători, în scopuri strict
educative, a fost lansată şi o variantă freeware, bineînţeles având anumite limitări –
Microsoft Visual Studio Express (tabelul 1 -1).

tabelul 1-1. Aplicaţiile din pachetul Microsoft Visual Studio Express


Denumire Descriere
Visual Basic Express variante limitate ale IDE-urilor cu acelaşi nume,
Visual C++ Express care permit dezvoltarea de aplicaţii în limbajele
Visual C# Express corespunzătoare
Visual Web Developer Express dezvoltarea site-urilor web în ASP.NET
SQL Server Express soluţie integrată pentru stocarea datelor

Scopul prezentului curs este familiarizarea cu dezvoltarea site-urilor web


utilizând aplicaţia Visual Web Developer Express, versiunea 2008. Cum principala
facilitate oferită de limbajele script server-side se referă la accesul la baze de date
aflate pe server, implicit, odată cu VWD va fi utilizat şi serverul SQL Express.
Ambele aplicaţii pot fi descărcate de pe pagina www.microsoft.com.

La instalarea SQL Server, trebuie precizate numele instanţei (implicit


SQLExpress), folderul în care vor fi salvate bazele de date (implicit C:\Program
Files\Microsoft SQL Server\) şi modalitatea de autentificare (recomandabil prin
maparea utilizatorilor sistemului de operare – Windows authentication mode). De
asemenea trebuie precizat utilizatorul administrator al serverului SQL (figura 1 -8).

Pentru SQL Server s-a ales versiunea SQL Server 2008 with Tools care
conţine pe lângă motorul SQL şi un utilitar pentru managementul vizual al serverului
şi al bazelor de date (SQL Server Management Studio Basic). Acesta permite accesul
într-o structură arborescentă la diferitele elemente aflate în legătură cu serverul SQL
(baze de date, securitate, replicare, management). Aceste elemente pot fi expandate
suplimentar, aşa cum este ilustrat în figura 1 -9.

3
figura 1-8. Instalarea SQL Server Express

figura 1-9. Aplicaţia Microsoft SQL Management Studio

2
Instalarea aplicaţiei Microsoft Visual Web Developer 2008 Express se
realizează într-o manieră simplă, toate componentele necesare configurându-se
automat (figura 1 -10).

figura 1-10. Instalarea pachetului Microsoft Visual Web Developer 2008 Express

1.2.2. Crearea primului site


După instalarea pachetului Microsoft Visual Web Developer 2008 Express,
la prima lansare a programului, acesta va arăta ca în figura 1 -11. Se observă
următoarele zone ale aplicaţiei:
 Recent Projects – proiectele recente la care s-a lucrat;
 Getting Started – support pentru utilizatorii începători;
 Solution Explorer – o vizualizare arborescentă, logică a proiectului;
 Properties – proprietăţile elementului selectat;
 Zona centrală – rezervată vizualizării WYSIWYG a paginilor sau vizualizării
codului;
 Zona de meniu – permite accesul la toate facilităţile aplicaţiei.
Toate aceste elemente (dar şi altele necesare în diferite etape ale dezvoltării
site-ului) pot fi afişate sau ascunse prin accesarea meniului View.
Pentru crearea unui site web, trebuie selectată opţiunea New Web Site din
meniul File. Apoi se alege tipul de site ce se doreşte a fi dezvoltat (ASP.NER Web
Site), locaţia pe hard-disk a fişierelor site-ului (implicit folderul Visual Studio 2008\
WebSites din My Documents) şi limbajul folosit pentru scrierea de cod (C#).
Denumirea site-ului este dată de ultimul folder specificat la Location (WebSite1) -
figura 1 -11.

3
figura 1-11. Crearea primului site ASP.NET

După precizarea acestor detalii, un site “blank” va fi generat. Există trei


posibilităţi de vizualizare a acestuia, selectabile prin acţionarea butoanelor Design,
Split, Source aflate în stânga jos. În figura 1 -12 este prezentat formatul mixt (Split)
de vizualizare ce permite studierea codului (partea superioară) dar şi a interfeţei
WYSIWYG (partea inferioară). Pentru exemplificare, în partea inferioară a fost scris
textul Salut, care a fost inclus în timp real şi în codul sursă, între etichetele HTML
<div></div>.

figura 1-12. Vizualizarea primului site web în VWD

2
De asemenea, în Solution Explorer se observă şi fişierele care alcătuiesc
acest site şi care se regăsesc în folderul My Documents\Visual Studio 2008\WebSites\
PrimulSite:
 Default.aspx – conţine cod HTML, JavaScript şi CSS;
 Default.aspx.cs – conţine cod C# asociat fişierului anterior;
 web.config – elemente de configurare ale site-ului prezentate în format XML şi
accesibile vizual prin accesare meniului Website – ASP.NET Configuration;
Tot în Solution Explorer se pot crea noi foldere (clic dreapta pe numele site-
ului) pentru organizarea paginilor şi a celorlalte resurse (imagini, fişiere audio sau
video, stiluri, etc). Deşi copierea resurselor poate fi realizată şi din sistemul de
oparare, este de preferat aducerea acestora prin drag and drop în zona Solution
Explorer. În mod similar resursele pot fi şterse sau redenumite.
Pentru construirea (Build) şi rularea cu verificarea erorilor (Debug) se poate
accesa opţiunea Debug – Start Debugging sau se poate apăsa tasta F5. În acest
moment este pornit un server web integrat în aplicaţia VWD care lucrează pe portul
1060 şi browser-ul Internet Explorer având încărcată pagina realizată, aşa cum este
ilustrat în .

figura 1-13. Vizualizarea primului site web în Internet Explorer

Întreruperea rulării site-ului se realizează fie prin accesarea opţiunii Debug –


Start Debugging, fie prin combinaţia de taste Shift-F5, fie prin închiderea paginii în
Internet Explorer.
În figura 1 -14 este prezentată modalitatea prin care se introduce cod
HTML în cadrul paginii web. În primul rând a fost creat folderul Imagini (în
Solution Explorer), apoi a fost adăugată imaginea banner.JPG şi ulterior a fost
inserată prin introducerea codului HTML corespunzător (marcat în imagine).
Mediul de dezvoltare oferă facilităţi clasice precum auto code completation
şi highlighting sintax. De asemenea, programatorul este avertizat asupra eventualelor
incompatibilităţi cu standardele W3C (de exemplu dacă nu se pune \ la sfârşitul
etichetei img sau dacă nu se precizează valoare pentru atributul alt). În zona
Properties se afişează în mod dinamic proprietăţile elementului selectat. Ele pot fi
modificate în mod vizual de aici, fără intervenţie directă asupra codului.

3
figura 1-14. Inserarea codului HTML în paginile site-ului

Tot prin clic dreapta pe denumirea soluţiei se poate accesa şi opţiunea Add
new item... ce determină afişarea unei ferestre precum cea din figura 1 -15.

figura 1-15. Adăugarea de noi itemi în cadrul proiectului

2
1.3. Configurarea accesului la site-ul web
De cele mai multe ori, în cazul portalurilor web există două tipuri de resurse:
cele accesibile tuturor vizitatorilor şi cele accesibile doar membrilor. În cadrul
acestei secţiuni va fi prezentată o modalitate simplă de a structura conţinutul
respectând aceste cerinţe de restricţionare a accesului.
În primul rând se creează un folder (e.g. FisiereleMembrilor) iar ulterior se
stabilesc roluri, reguli asociate acestor roluri şi membrii. Toate aceste setări se
realizează cu ajutorul instrumentului Web Site Administration Tool.

1.3.1. Stabilirea modalităţii de autentificare


Accesul la instrumentul Web Site Administration Tool se realizează prin
accesarea meniului Website – ASP.NET Configuration. Interfaţa de administrare este
de tip web aşa cum este ilustrat în figura 1 -16.

figura 1-16. Interfaţa de administrare a site-ului

Deoarece membrii vor fi stocaţi într-o bază de date, este necesară verificarea
accesibilităţii serverului SQL Server. Ca şi în cazul serverului web, VWD are inclus
un server SQL utilizabil pentru faza de dezvoltare. Din tab-ul Provider se selectează
opţiunea Select a single provider for all site management data, şi apoi se testează
conectivitatea la baza de date prin activarea legăturii Test. Ar trebui să apară mesajul
Successfully established a connection to the database.
Următorul pas se referă la stabilirea tipului de autentificare folosit:
Microsoft Windows authentication (from a local network) – se utilizează numele şi

3
parolele oferite de sistemul de operare sistemului; Form authentication (from the
internet) – se utilizează numele şi parolele oferite de utilizator şi comparate cu cele
din baza de date. Pentru stabilirea tipului de autentificare la cea de-a doua variantă,
se alege tab-ul Security, apoi Select authentication type şi se bifează From the
internet, după care se acţionează butonul Done - figura 1 -17.

figura 1-17. Alegerea tipului de autentificare pentru membrii site-ului

1.3.2. Gestionarea rolurilor şi a utilizatorilor


Pentru gestiunea accesului utilizatorilor la resursele unui site se foloseşte
conceptul de rol. El se suprapune cu conceptul de grup de utilizatori în sensul că
utilizatorii ce au acelaşi rol se bucură de aceleaşi drepturi deci aparţin aceluiaşi
grup. Activarea rolurilor se realizează din tab-ul Security prin indicarea opţiunii
Enable roles. Tot acest tab permite gestiunea rolurilor, regulilor de acces şi a
utilizatorilor - figura 1 -18.

figura 1-18. Gestiunea utilizatorilor, rolurilor şi regulilor de acces

2
Crearea unui rol nou se realizează prin acţionarea legăturii Create or
Manage roles. În continuare este afişată lista tuturor rolurilor cu posibilităţile de:
 Creare rol (Create New Role) – se specifică numele acestuia;
 Ştergere rol (Delete) – se indică rolul ce se doreşte a fi şters;
 Management rol (Manage) – editarea relaţiilor între roluri şi utilizatori.

Crearea unui utilizator presupune alegerea opţiunii Create user şi


indicarea unor informaţii specifice (nume, parolă, confirmare parolă, email,
întrebare de securitate, răspuns corect la întrebarea de securitate). De asemenea se
pot specifica rolurile utilizatorului, cu menţiunea că acelaşi utilizator poate avea
mai multe roluri (figura 1 -19).
Cerinţele de securitate prevăd obligativitatea întrebării de securitate şi o
parolă de minim 7 caractere, dintre care minim unul diferit de litere sau cifre (e.g.
semn de punctuaţie). De asemenea se poate preciza dacă un utilizator este activ
sau nu (implicit se consideră activ). Starea de inactivitate poate fi utilizată atunci
când de exemplu clientul a întârziat plata cotizaţiei şi se doreşte suspendarea
temporară a drepturilor. Ştergerea din baza de date, deşi posibilă, nu ar fi cea mai
bună variantă în acest caz.

figura 1-19. Crearea unui utilizator

Gestiunea utilizatorilor (Manage users - figura 1 -20) permite editarea


informaţiilor asociate unui utilizator, ştergerea acestuia sau modificarea
apartenenţei la diferite grupuri (roluri). Există facilitatea de căutare rapidă a unui
utilizator după nume sau email (eventual cu folosirea wildcard-urilor) sau de
grupare dupa prima literă. În această imagine se observă 2 utilizatori creaţi (ovidiu
şi andrei), ambii asociaţi rolului membru. Asocierea dintre utilizatori şi roluri
poate fi realizată atât prin opţiunea Manage users cât şi prin opţiunea Manage
roles. Diferă doar entitatea din punctul căreia se priveşte (utilizator sau rol).

3
figura 1-20. Gestiunea utilizatorilor şi asocierea rolurilor

1.3.3. Gestionarea regulilor de acces


Se referă la posibilitatea de a indica pentru fiecare folder din cadrul
proiectului accesibilitatea (Allow sau Deny) la nivel de utilizator sau la nivel de
rol. Se selectează folderul, apoi cui se aplică regula (unui rol, unui utilizator,
tuturor utilizatorilor, utilizatorului anonim) iar în final dacă regula oferă accesul
sau îl împiedică – figura 1 -21.
După creare, şi regulile de acces pot fi editate, la fel ca şi utilizatorii sau
rolurile. Pentru aceasta trebuie indicată opţiunea Manage access rules. În figura
1 -22 se observă faptul că există o regulă implicită care oferă drept de acces la
toţi utilizatorii (implicit anonimi) şi o regulă care împiedică explicit accesul
utilizatorilor anonimi. Prima regulă (care nu poate fi ştearsă) se referă la faptul că
implicit se consideră că informaţia site-ului se doreşte a fi accesibilă şi altora. A
doua regulă, mai prioritară deoarece este o regulă tip Deny, rafinează prezumţia
iniţială.
Toate aceste setări efectuate în mod vizual îşi au corespondentul în trei
fişiere din folderul proiectului: ASPNETDB.MDF, Web.config (din folderul
FisiereleMembrilor) şi Web.config aflat în rădăcina soluţiei.
Pentru a verifica efectiv accesul la site pe bază de utilizatori şi parole este
necesară crearea unui formular de login (login.aspx), demers ce este obiectul unei
secţiuni viitoare.

2
figura 1-21. Crearea regulilor de acces la folder-ele proiectului

figura 1-22. Vizualizarea şi gestionarea regulilor de acces

3
1.4. Elemente de design ale site-ului
Această secţiune se adresează în primul rând celor ce au mai dezvoltat un
site web static utilizând tehnologii precum HTML şi CSS. Este trecută în revistă
facilitatea cu care vine VWD pentru crearea unui aspect unitar al site-ului –
Master Pages. De asemenea sunt indicate modalităţile de lucru cu cod HTML şi
CSS.

1.4.1. Utilizarea Master Pages în cadrul site-ului


Un site web profesionist se caracterizează în primul rând printr-o interfaţă
unitară cu utilizatorul atât la nivelul înfăţişării cât şi la nivelul comportamentului
– acelaşi look and feel. Principala caracteristică a VWD care permite această
abordare consecventă a paginilor unui site este Master Pages.
Pentru păstrarea unei bune organizări ale fişierelor proiectului, fişierele
aferente Master Pages ar trebui amplasate într-un folder special, de exemplu
FisiereMasterPages. Ulterior, în cadrul acestui folder, trebuie adăugat Master
Pages prin alegerea itemului corespunzător din interfaţa din figura 1 -15,
interfaţă la care se ajunge prin alegerea opţiunii New item din meniul contextual al
folderului nou creat. Numele poate fi modificat sau se poate păstra cel predefinit
(MasterPage.master). Limbajul de programare va fi selectat la C# şi codul va fi
introdus într-un fişier separat.
După generare se creează o nouă pereche de fişiere design – cod sursă. De
asemenea se observă apariţia controlului ContentPlaceHolder. Acest control
este locaţia în care fiecare pagină a site-ului va apărea.

<asp:ContentPlaceHolder id="ContentPlaceHolder1" runat="server">


</asp:ContentPlaceHolder>

Primul pas în stabilirea modului în care site-ul va apărea este indicarea


layout-ului adică a modului de organizare a informaţiei pe ecran. Exemplul
următor se referă la crearea unui layout clasic, cu o zonă sus, una stânga şi alta
jos:
 Se comută pe modul Design de vizualizare;
 Se face clic oriunde în pagină în afară de ContentPlaceHolder;
 Se inserează un table cu 3 rânduri şi o coloană (Table – Insert table);
 Se face clic pe rândul median şi se alege Table – Modify – Split cells;
 Se indică 2 coloane;
 Se modifică dimensiunile celulelor fie prin introducerea de valori pentru
proprietăţile Width şi Height în panelul Properties fie vizual, prin tragerea
marginilor cu mouseul;
 Se trage ContentPlaceHolder pe celula din dreapta şi rândul median.

2
Aşa cum se poate vedea şi din codul sursă, layout-ul este de fapt un tabel.
Inserarea controlului ContentPlaceHolder într-o celulă semnifică faptul că acea în
acea celulă se va amplasa conţinutul paginilor site-ului, restul structurii rămânând
aceeaşi.
Modificarea stilului fiecărei celule se poate realiza prin indicarea ei,
urmată de alegerea proprietăţii Style din zona Properties. Va apărea fereastra
Modify Style care permite stabilirea în mod vizual a elementelor ce ţin de
aspectul itemului selectat – figura 1 -23.

figura 1-23. Accesul la stilul CSS a unui element

Pentru o mai bună înţelegere a conceptului de Master Page, se pot pune


culori distincte de fundal pentru fiecare celulă (zonă de afişare) în parte. De
asemenea se pot stabili şi aici dimensiunile (fixe sau procentuale) ale fiecărei
celule, din tab-ul Position. În principiu, zona în care s-a încărcat
ContentPlaceHolder nu trebuie stilizată deoarece fiecare pagină a site-ului se va
încărca în această celulă şi va veni cu propriul aspect. Totuşi este posibilă
alinierea vertical-sus a controlului.
Pentru verificarea MasterPage-ului nou creat se poate realiza o nouă
pagină în cadrul site-ului: Add New Item – Web Form (cu numele setat la
TestMaster.aspx şi bifat Select master page) – Add – selectarea fişierului
MasterPage.master.

3
Această pagină nou creată va conţine zonele definite în MasterPage în
format needitabil. Singura zonă care poate fi editată este cea aferentă controlului
ContentPlaceHolder. Rezultatul poate fi văzut în figura 1 -24.

figura 1-24. Exemplificare utilizare Master Page

Se pot crea oricâte pagini pornind de la acelaşi MasterPage şi orice


editare a unui MasterPage determină actualizarea automată a tuturor paginilor
creat pe baza sa.
Nu există o modalitate vizuală de a asocia unei pagini deja create un
MasterPage. Trebuie copiat tot conţinutul paginii, creată o altă pagină de data
aceasta pe baza MasterPage-ului şi apoi lipit conţinutul anterior în
ContentPlaceHolder. Dacă totul a decurs normal, pagina anterioară poate fi
ştearsă.

1.4.2. Personalizarea paginilor ASP.NET prin integrarea codului HTML


Tot ceea ce se poate crea într-o pagină HTML obişnuită se poate realiza şi
cu ajutorul VWD. Diferenţa este că acest mediu de dezvoltare oferă posibilităţi
WYSIWYG şi interfeţe vizuale de introducere a codului.
Scopul prezentului material nu este familiarizarea cu limbajul HTML sau
CSS şi de aceea nu va fi pus accent pe aceste elemente. De asemenea trebuie de
remarcat faptul că designul unui site este mai mult o problemă artistică decât una
tehnică.

2
Tabelele pot avea un rol deosebit în cadrul paginii web întrucât pot oferi
suport pentru poziţionarea celorlalte elemente. Toate opţiunile necesare pentru
lucrul cu tabele se regăsesc în meniul Table.
Adăugarea de legături între pagini se poate realiza prin tragerea paginii
destinaţie în cadrul paginii sursă. Acelaşi lucru se poate realiza prin selectarea
elementului care va deveni legătură şi apăsare butonului Convert to Hyperlink din
meniul Format sau din toolbar.
În mod similar poate fi adăugată o imagine, prin tragerea acesteia în
locaţia dorită. Bineînţeles că iniţial este recomandată copierea imaginii într-un
folder al proiectului.
Editarea în codul sursă este şi ea uşurată prin facilitatea
AutoCodeCompletation, posibilă datorită meniului contextual IntelliSense.

1.4.3. Personalizarea paginilor ASP.NET prin integrarea codului CSS


VWD oferă suport atât pentru inserarea codului CSS în acelaşi fişier cu
codul HTML cât şi pentru crearea foilor externe de stiluri. În meniul contextual al
proiectului se selectează Add Item şi apoi se alege Style Sheet şi se precizează
numele fişierului cu extensie CSS.
Pentru adăugarea unei reguli în fişierul CSS se poate alege opţiunea Add
Style Rule din toolbar-ul Style Sheet sau din meniul contextual afişat la clic
dreapta pe foaia cu stiluri. Afişarea sau ascunderea unui toolbar se realizează din
meniul View – Toolbars – bifare sau debifare item.
Adăugarea unei reguli necesită specificarea selectorului ei: element,
clasă, ID şi are ca efect afişarea unei reguli vide. Ulterior, prin clic dreapta în
codul sursă CSS, se poate construi stilul asociat respectivei reguli (opţiunea Build
Style...). Fereastra de editare a stilurilor este cea prezentată în figura 1 -23.
O foaie de stiluri, odată creată, poate fi importată într-o pagină sau într-o
Master Page, cel mai simplu prin Drag and Drop. Fiecare stil creat poate fi
aplicat în mod vizual, utilizând lista de stiluri din toolbar.

3
1.5. Controale ASP.NET HTML
Controalele ASP.NET sunt elemente care pot fi introduse într-o pagină
web. Există patru categorii de controale ASP.NET:
 Controale Server HTML (HTML Server Controls) – conversie rapidă a
controalelor HTML (Form, Button, CheckBox, Select, Table, Image etc) din
controale client-side în controale server-side;
 Controale Server Web (Web Server Controls) – controale server dedicate;
 Controale utilizator (Custom Controls) – pentru suplimentarea controalelor
predefinite.
În această secţiune se va prezenta un formular simplu de introducere a
datelor utilizând exclusiv controale HTML. Datele din acest formular vor fi
prelucrate pe partea de server şi se va formula un răspuns.
Iniţial se va prezenta o variantă “clasică”, cu controale HTML obişnuite
iar apoi varianta cu controale Server HTML.

1.5.1. Realizarea unui formular utilizând controale HTML clasice


Se propune crearea unui formular clasic, care să afişeze în pagina web
controalele ilustrate în figura 1 -25.

figura 1-25. Exemplu de formular

Pentru aceasta se creează ConvHTML.aspx, listat în continuare. Se


observă utilizarea mai multor controale, unul de tip text, două de tip radio având
aceleaşi nume pentru a funcţiona în tandem, unul de tip select, trei de tip
checkbox, unul de tip textarea, unul de tip submit şi unul de tip reset. Toate
controalele pot fi inserate fie din cod sursă fie prin Drag and Drop din secţiunea
HTML a toolbox-ului.

2
Fişierul de răspuns se consideră tot ConvHTML.aspx (pur şi simplu se va
reafişa pagina) Metoda folosită pentru trimiterea datelor este get, ceea ce
înseamnă că acestea vor fi transmise serverului în cadrul querry_string.

localhost:1060/PrimulSite/ConvHTML.aspx?
nume=Ovidiu&sex=masc&varsta=v_19_35&Linux=on&Windows=on&comentarii=Linux+doar+in+ma
sini+virtuale.&submit=Trimite+la+server

<h3>Chestionar privind sistemul de operare folosit.</h3>


<form action="ConvHTML.aspx" method="get">
<pre>
Nume: <input type="text" name="nume" id="nume" />
Sexul: <input type="radio" name="sex" id="masc" value="masc" />masculin
<input type="radio" name="sex" id="fem" value="fem" />feminin
Interval de varsta:
<select name="varsta" id="varsta" size="1">
<option value="v_lipsa"> - </option>
<option value="v_sub_18">sub 18</option>
<option value="v_19_35">intre 19 si 35</option>
<option value="v_36_65">intre 36 si 65</option>
</select>
Sisteme de operare folosite:
<input type="checkbox" name="Linux" id="Linux" />Linux
<input type="checkbox" name="MacOS" id="MacOS" />MacOS
<input type="checkbox" name="Windows" id="Windows" />Windows
<textarea name="comentarii" id="comentarii" cols="20" rows="2"></textarea>
<input type="submit" name="submit" id="submit" value="Trimite "/>
<input type="reset" name="reset" id="reset" value="Reseteaza" />
</pre>
</form>

Rulând acest fişier se pot observa două probleme:


 La reîncărcarea paginii (fie prin reîncărcarea paginii fie prin acţionarea
butonului Trimite) toate datele introduse deja se pierd datorită faptului că
protocolul HTTP nu salvează starea între două cereri succesive;
 Dacă se doreşte prelucrarea în cadrul fişierului de răspuns (ConvHTML.aspx) a
datelor transmise, controalele HTML nu mai au o reprezentare directă pe server,
ci doar datele transmise din ele (în fişierul ConvHTML.aspx se pot accesa doar
perechile nume=valoare preluate din querry_string)
Ambele neajunsuri pot fi rezolvate şi în varianta clasică de lucru cu
scripturi pe server prin utilizarea conceptului de sesiune şi prin păstrarea de-a
lungul sesiunii a tuturor datelor necesare. Oricum, aceste acţiuni necesită un efort
de programare considerabil şi tocmai aici intervine rolul deosebit al controalelor
Server HTML.
Aceste controale se deosebesc de controalele HTML clasice prin aceea că
îşi păstrează o “imagine” în cadrul unei clase pe server atunci când documentul
(e.g. ServHTML.aspx) este solicitat, astfel încât la o cerere ulterioară adresată
motorului ASP.NET de pe server, acesta are acces la obiectele de programare

3
asociate. Programarea răspunsului devine mult mai naturală întrucât se lucrează
cu obiecte şi nu cu perechi nume=valoare.
De asemenea, motorul ASP.NET iniţiază o sesiune pe server care va fi
activă (i.e. datele salvate în cadrul ei vor fi accesibile) pentru toate cererile
ulterioare, până la închiderea browser-ului de exemplu. În acest mod, datele
provenite de la cereri HTTP anterioare rămân persistente pe server şi pot fi
accesate.
Elementul esenţial care permite păstrarea unei sesiuni este identificatorul
de sesiune, transmis prin controale ascunse sau prin mecanismul cookie-urilor de
la o cerere HTTP la alta. Pe baza acestui identificator unic sunt regăsite
informaţiile asociate respective sesiuni.
Sintetizând, etapele comunicaţiei client server devin:
1. Serverul web primeşte o cerere pentru o pagină aspx;
2. Serverul web localizează pagina pe hard-disk;
3. Serverul web transmite pagina motorului ASPX;
4. Motorul ASP.NET compilează pagina şi generează clasa asociată; dacă clasa
este deja generată de la o cerere anterioară, ea doar se instanţiază;
5. Motorul ASP.NET instanţiază clasa, realizează procesările necesare şi
generează obiectul răspuns (Response);
6. Serverul web trimite acest răspuns clientului.

1.5.2. Modificarea formularului pentru a utiliza controale server HTML


Singura modificare ce trebuie realizată în fişierul ServHTML.aspx pentru
a utiliza controale server HTML constă în a adăuga atributul runat cu valoarea
“server” la fiecare control, inclusiv la form. Pe baza acestei directive se va
declanşa tot mecanismul de păstrare a stării descris în secţiunea anterioară
(crearea clasei pe server, crearea sesiunii şi transmiterea identificatorului de
sesiune de la o cerere HTTP la alta). Bineînţeles că trebuie modificată şi valoarea
atributului action din tag-ul form la valoarea ServHTML.aspx.
La utilizarea noii pagini se observă imediat diferenţa faţă de exemplul
anterior, în sensul că la refresh sau la acţionarea butonului Trimite, datele
introduse deja sunt păstrate. De asemenea, dacă se vizualizează codul sursă a
fişierului primit de client (listat în continuare), se observă trei aspect esenţiale:
 Controalele server HTML au fost mapate identic în controale HTML simple;
 Au apărut două controale ascunse (type=”hidden”): __VIEWSTATE şi
__EVENTVALIDATION cu rolul de a păstra datele în cadrul sesiunii (între
două cereri HTTP succesive);
 După scrierea unor date şi acţionarea butonului Trimite, controalele server
HTML au fost mapate în controale HTML simple dar cu iniţializarea valorilor
corespunzătoare.

2
<h3>Chestionar privind sistemul de operare folosit.</h3>
<form name="Form1" method="get" action="ServHTML.aspx" id="Form1">
<input type="hidden" name="__VIEWSTATE" id="__VIEWSTATE"
value="/wEPDwULLTE3MzcxMzg0OTUPZBYCAgMPZBYCAg8PFgIeCWlubmVyaHRtbAUEZWRlZWQYAQUeX19D
b250cm9sc1JlcXVpcmVQb3N0QmFja0tleV9fFgUFBG1hc2MFA2ZlbQUFTGludXgFBU1hY09TBQdXaW5kb3d
z8aNqClb46aYYRTLL0xBR1C1ZtA4=" />

<input type="hidden" name="__EVENTVALIDATION" id="__EVENTVALIDATION"


value="/wEWCgLEj//HDQL7uKQeAqGLpL0EAryvnsIKApyn6+YIAoadzbQBAser+usDAuWC3vACAs2pk4UL
Aty7hLYEfqUcsTG5vXkIdeO8TV4cdccDU+Y=" />

<pre>
Nume: <input name="nume" type="text" id="nume" value="Ovidiu" />
Sexul: <input value="masc" name="sex" type="radio" id="masc" checked="checked"
/>masculin
<input value="fem" name="sex" type="radio" id="fem" />feminin
Interval de varsta:
<select name="varsta" id="varsta" size="1">
<option value="v_lipsa" id="Option1"> - </option>
<option value="v_sub_18" id="Option2">sub 18</option>
<option selected="selected" value="v_19_35" id="Option3">intre 19 si 35</option>
<option value="v_36_65" id="Option4">intre 36 si 65</option>
</select>
Sisteme de operare folosite:
<input name="Linux" type="checkbox" id="Linux" checked="checked" />Linux
<input name="MacOS" type="checkbox" id="MacOS" />MacOS
<input name="Windows" type="checkbox" id="Windows" checked="checked" /> Windows
<textarea name="comentarii" id="comentarii" cols="20" rows="2">Linux doar in
masini virtual.</textarea>

<input name="submit" type="submit" id="submit" value="Trimite la server" />


<input name="reset" type="reset" id="reset" value="Reseteaza" />
</pre>
</form>

1.5.3. Exemplu de prelucrare pe server a datelor provenite de la client


În această secţiune se va prezenta un exemplu de prelucrare a datelor pe
server. Toate acţiunile (listarea valorilor din controale în zona destinată
comentariilor) sunt precizate în limbajul C#, în fişierul ServHTML.aspx.cs.
Întrucât nu s-au definit alte evenimente, se consideră evenimentul
standard Page_Load care se tratează prin procedura listată. Starea paginii (prima
apelare sau următoarele) se determină pe baza variabile Page.IsPostBack.
Codul listat în continuare este comentat şi poate fi înţeles pe baza
experienţelor anterioare în scrierea de programe orientate obiect. De altfel,
comentariile încearcă să surprindă toate aspectele care ar putea fi confuze.
Rezultatul obţinut după precizarea informaţiilor şi după apăsarea
butonului Trimite, poate fi observat în figura 1 -26.

3
protected void Page_Load(object sender, EventArgs e){
// la prima incarcare a paginii se adauga un item in lista varsta
// si se stabileste indexul current din lista
if (!Page.IsPostBack) {
varsta.Items.Add("peste 65");
varsta.SelectedIndex = 0;
}
// daca s-a realizat deja submit se afiseaza valorile introduse
// in zona comentariilor
else {
String buf; // se creaza un sir de caractere
// se mareste zona comentariilor
comentarii.Rows = 6;
comentarii.Cols = 50;
// se schimba culoarea zonei
comentarii.Style.Add("background-color", "yellow");
// se scriu prin concatenare datele in buf
buf = "Ai ales urmatoarele valori:";
// numele introdus in campul nume
buf += "\nnume=" + nume.Value;
// sexul persoanei
if(masc.Checked) buf += "\nsexul=" + masc.Value;
else buf += "\nsexul=" + fem.Value;
// varsta persoanei
buf += "\nvarsta=" + varsta.Items[varsta.SelectedIndex].Text;
// se adauga pe rand sistemele de operare folosite
buf += "\nOS=";
// si se numara cele bifate
int osNr=0;
if (Linux.Checked) { buf += "Linux,"; osNr++; }
if (MacOS.Checked) { buf += "MacOS,"; osNr++; }
if (Windows.Checked) {buf += "Windows,"; osNr++;}
// daca nu s-a bifat niciunul, se afiseaza '-'
if (osNr == 0) buf += " - ";
// altfel se sterge ultima virgula
else buf = buf.Substring(0,buf.Length - 1);
// si se adauga si valoarea din campul comentarii
buf += "\ncomentarii=" + comentarii.Value;
// in final se scriu datele in textarea
comentarii.Value = buf;
} }

figura 1-26. Rezultatul rulării paginii ServHTML.aspx

2
1.6. Controale web ASP.NET de bază

1.6.1. Prezentare generală a controalelor web ASP.NET


Controalele server HTML au fost introduse pentru a permite conversia
rapidă a aplicaţiilor ASP (ce lucrează doar cu controale HTML client) în aplicaţii
ASP.NET.
Adevărata forţă a ASP.NET rezidă însă în controalele web predefinite,
care constituie o colecţie remarcabilă de obiecte ce permit dezvoltarea rapidă a
aplicaţiilor. Această colecţie poate fi împărţită în următoarele categorii, în
concordanţă cu ierarhia din Toolbox (figura 1 -27):
 Controale web de bază (Standard) – în mare parte echivalente cu controalele
server HTML;
 Controale web pentru gestiunea accesului utilizatorilor (Login);
 Controale web pentru navigare în cadrul site-ului (Navigation);
 Controale web pentru validarea datelor de intrare (Validation);
 Controale web pentru accesul la bazele de date (Data);
 Controale web ce permit implementarea Ajax (Ajax Extensions).

figura 1-27. Categorii de controale web ASP.NET şi controalele Standard

În general este preferabilă utilizarea controalelor web în locul


controalelor server HTML. Ele oferă o mai bună independenţă a codului faţă de
nivelul client deoarece tot codul HTML necesar la client şi corespunzător
controalelor web este generat automat. Întradevăr, aplicaţiile se dezvoltă
respectând acelaşi model ca în cazul aplicaţiilor stand-alone. Datorită unui model
obiectual unitar, controalele web echivalente celor server HTML se integrează
optim cu celelalte controale web.
Pe de altă parte, avantajul controalele server HTML rezultă din faptul că
programatorul poate controla mai uşor ce se întâmplă pe partea clientului (codul
aferent controalelor, scris în documentul aspx, ajunge aproximativ în aceeaşi
variantă în browser). De asemenea, integrarea cu limbaje script client-side (e.g.
JavaScript) este mai bună. Oricum, cele două tipuri de controale pot coexista într-
o aceeaşi pagină.

3
Pentru ilustrarea modalităţii de utilizare a controalelor web se vor
prezenta diferite aplicaţii. Bineînţeles că nici nu vor fi utilizate toate controalele
posibile, nici nu vor fi editate toate proprietăţile acestora. De asemenea nu se vor
utiliza nici toate metodele asociate şi nici nu se vor trata toate evenimentele
posibile. Abordările exhaustive – Refferences Book – au nevoie de mii de pagini.
De asemenea abordările de tipul – Developer Guide – utilizează sute de pagini
pentru a prezenta aspecte destul de tehnice.
Materialul de faţă îşi propune doar să fie un punct de plecare, să ofere o
imagine de ansamblu asupra posibilităţilor ASP.NET. Ulterior este posibilă
consultarea permanentă a help-ului, a documentaţiei MSDN şi a multitudinii de
tutoriale existente on-line. Această ultimă abordare se pretează cel mai bine
pentru îndeplinirea sarcinilor punctuale (How to...). De asemenea, tutorialele
disponibile on-line au o valoare adăugată prin aceea că includ aşa numitele Best
Practices, adică recomandările pentru o cât mai bună utilizare a controalelor.
Aşa cum se întrevede în acest punct al cursului, a învăţa ASP.NET
înseamnă a învăţa despre controalele web. Asta bineînţeles după ce a fost studiată
filosofia şi modul de lucru al motorului ASPX.
Includerea controalelor ASP.NET într-o aplicaţie aspx se poate realiza fie
prin Drag and Drop din Toolbox, fie în sursă, prin scrierea codului corespunzător.
De asemenea, editarea proprietăţilor se poate realiza fie în modul Source, cu
ajutorul meniului contextual inteligent, fie în modul Design, cu ajutorul
ferestrei proprietăţi (Properties Window). O abordare posibilă este şi cea mixtă,
cu vizualizarea în acelaşi timp a ambelor formate.

1.6.2. Includerea în modul Design a controalelor web ASP.NET


În continuare va fi prezentat un formular pentru înscrierea unei persoane
fizice sau juridice pe un site. Acest formular este dezvoltat cu ajutorul unor
controale web ASP.NET din categoria Standard (figura 1 -28).
La începutul formularului, prin intermediul a două butoane radio se
stabileşte tipul înscrierii: persoană fizică sau persoană juridică. Ulterior se permite
introducerea numelui şi a CNP-ului sau a denumirii şi a CIF-ului. Înaintea
respectivelor controale de tipul TextBox sunt incluse controale de tip Label a căror
conţinut se modifică în funcţie de butonul radio selectat.
După indicarea domeniului de activitate prin bifarea unor controale de tip
CheckBox se poate opta pentru primirea de înştiinţări despre noutăţile siteului sau
pentru ignorarea acestei facilităţi. De aceea controlul TextBox asociat emailului
apare doar dacă este bifat checkbox-ul corespunzător.
La final este posibilă încărcarea unei imagini pe server cu ajutorul unui
control de tip FileUpload şi a unui control de tip Button (Incarca imaginea). De
asemene, această imagine este automat vizualizată într-un control de tipul Image.
Imaginea poate fi o poza personală sau sigla firmei.

2
figura 1-28. Diferite scenarii de utilizare ale formularului

În primul scenariu, o persoană juridică introduce denumirea, codul CIF,


două domenii de activitate şi alege o imagine reprezentativă pentru firmă. Nu se
doreşte furnizarea unui email pentru a primi noutăţi despre site.
În cel de-al doilea scenariu, o persoană fizică introduce numele, CNP-ul,
alege un domeniu de activitate şi încarcă o imagine reprezentativă. Deoarece
domnul Ionescu doreşte să primească informaţii despre noutăţi, s-a bifat controlul
respectiv de tip CheckBox. Automat a apărut controlul necesar introducerii
adresei de email.
La final este posibilă încărcarea unei imagini pe server cu ajutorul unui
control de tip FileUpload şi a unui control de tip Button (Incarca imaginea). De
asemene, această imagine este automat vizualizată într-un control de tipul Image.
Imaginea poate fi o poza personală sau sigla firmei.

1.6.3. Includerea în modul Source a controalelor web ASP.NET


Fiecărui control introdus în modul Design i se asociază o secvenţă de cod
precum cea ilustrată în continuare:

<asp:TextBox ID="nume" runat="server"></asp:TextBox

Se observă tipul controlului (TextBox), identificatorul (nume) şi directiva


de rulare pe server. Este important ca fiecare control să aibă un identificator
sugestiv deoarece acesta va fi folosit şi în fişierul sursă C#.

3
O variantă iniţială (fără tratarea evenimentelor) a codul fişierului
BasicWebControls.aspx este listat în continuare. Comentariile asociate codului
oferă explicaţiile necesare înţelegerii acestuia.

<!--incepe formularul pentru inscriere-->


<form id="inscriere" runat="server">

<!--se include butonul radio corespunzator persoanei fizice-->


<!--butoanele radio au acelasi GroupName pentru a lucre in tandem-->
<!--textul care va aparea langa control este precizat ca proprietate-->
<asp:RadioButton ID="fizica" GroupName="tip" runat="server"
Text="Persoana fizica" />

<!--se include butonul radio corespunzator persoanei fizice-->


<asp:RadioButton ID="juridica" GroupName="tip" runat="server"
Text="Persoana juridica" /><br/>

<!--se include etcheta in care se va scrie nume sau denumire-->


<!--in functie de butonul radio bifat-->
<!--latimea este stabilita la 70 pixeli-->
<asp:Label ID="lNume" runat="server" Text="nume" Width="70"></asp:Label>
<asp:TextBox ID="nume" runat="server"></asp:TextBox><br/>
<!--se include etcheta in care se va scrie CNP sau CIF-->
<asp:Label ID="lId" runat="server" Text="CNP" Width="70">
</asp:Label><asp:TextBox ID="id" runat="server"></asp:TextBox><br/><br/>

<!--se include cele trei controale pentru tipul de activitate -->


<!--se remarca din nou introducerea textului asociat ca proprietate-->
domeniu de activitate:<br/>
<asp:CheckBox ID="comert" runat="server" Text="comert"/> <br/>
<asp:CheckBox ID="productie" runat="server" Text="productie"/> <br/>
<asp:CheckBox ID="servicii" runat="server" Text="servicii"/> <br/><br/>

<!--se include checkbox-ul pentru indicarea dorintei de a fi instiintat-->


<asp:CheckBox ID="instiintare" runat="server"
Text="Doresc sa fiu instiintat pe email despre noutati!" />
<!--se include controlul pentru precizarea emailului-->
<asp:TextBox ID="email" runat="server"></asp:TextBox><br/><br/>

<!--se include controlul pentru alegerea fisierului imagine-->


<asp:FileUpload ID="upload" runat="server"/>
<!--butonul incarca permite transferul imaginii pe server-->
<!--si amplasarea acestuia in controlul de tip Image-->
<asp:Button ID="incarca" runat="server" Text="Incarca imaginea" /><br/>
<!--se include controlul in care se va afisa imaginea-->
<asp:Image ID="imagine" runat="server" Width="200px" />

</form>

2
1.6.4. Tratarea evenimentelor asociate controalelor web ASP.NET
Un element esenţial al programării actuale este reprezentat de evenimente
(Events). Acestea sunt asociate diferitelor acţiuni la care participă controale
(încărcare, clic, schimbare valoare, etc) şi pot fi “tratate” prin anumite rutine.
Aceste rutine sunt apelate automat la apariţia evenimentului.
Controalele ASP.NET oferă posibilitatea tratării unor evenimente, în
funcţie de tipul efectiv al controlului. Evenimentele asociate unui control pot fi
vizualizate în fereastra Properties, tab-ul Events. Evenimentele apar independent
de voinţa programatorului. Acesta poate însă asocia unui eveniment o anumită
procedură care să execute anumite acţiuni la apariţia evenimentului.
Pentru ca unui eveniment al unui control web să i se asocieze o rutină de
tratare, cel mai simplu este să se facă dublu clic pe acest eveniment, în fereastra
Properties.
În acest moment apar două modificări esenţiale:
 În fişierul .aspx apare asocierea între eveniment şi o rutină de tratare (cu
nume predefinit), în cadrul controlului web;
 În fişierul .cs se oferă posibilitatea introducerii codului asociat.
Ilustrăm acest lucru prin indicarea modificărilor ce apar în cazul
controlului chackbox instiintare.

<asp:CheckBox ID="instiintare" runat="server" AutoPostBack="true"


Text="Doresc sa fiu instiintat pe email despre noutatile de pe site!"
oncheckedchanged="instiintare_CheckedChanged"/>

protected void instiintare_CheckedChanged(object sender, EventArgs e){


// daca este bifat se face vizibil controlul email
// se indica in cadrul sau ca acolo trebuie scris emailul
// se pozitioneaza cursorul pe controlul email
if (instiintare.Checked) {
email.Visible = true;
email.Text = "aici scrieti emailul";
email.Focus();
}
// alfel, controlul email devine vizibil
else {
email.Visible = false;
}
}

În cadrul fişierului .aspx apare asocierea dintre eveniment


(oncheckedchanged) şi procedura de tratare a evenimentului
(instiintare_CheckedChanged). În fişierul .cs procedura respectivă primeşte două
argumente ce oferă eventuale informaţii referitoare la contextul în care a apărut
evenimentul.

3
Un element foarte important este atributul AutoPostBack setat la valoarea
true. Acesta îi permite controlului instiintare să efectueze un apel la server pentru
a efectua modificările necesare. Un efect colateral este reâncărcarea paginii,
aceasta deoarece codul ce trebuie executat este server-side şi nu client-side (e.g.
JavaScript). Astfel, toate evenimentele care vor avea asociate proceduri de tratare
şi care aparţin controalelor cu posibilitate de PostBack, determină reîncărcarea
paginii.
Acest lucru este la prima vedere destul de supărător deoarece într-un
formular poate fi necesar tratarea destul de multor evenimente şi implicit
reîncărcarea de multe ori a paginii. Totuşi:
 La ora actuală conexiunile Internet sunt de obicei suficient de bune pentru a
permite reîncărcarea practic instantanee;
 Prin anumite tehnici este posibilă reîncărcarea doar a porţiunii modificate din
fişier;
 Cu ajutorul tehnologiei Ajax, transferul datelor între client şi server se poate
realiza “pe dedesubt” fără ca utilizatorul să observe reîncărcarea paginii;
 Pentru optimizare, poate fi inclus cod JavaScript care să efectueze la client
modificările necesare (bineînţeles că se pierde parţial din simplitatea
modelului de programare oferit de ASP.NET);
 Pe viitor, este posibilă apariţia de noi versiuni de controale, cu facilităţi de
indicare a locului în care să ruleze procedurile de tratare a evenimentelor; în
cazul indicării platformei client, codul JavaScript necesar ar putea fi generat
automat.
În continuare sunt indicate toate modificările ce apar în fişierul
BasicWebControls.aspx precum şi listarea fişierului BasicWebControls.aspx.cs.

<!--. . . . . . . . . . .-->
<asp:RadioButton ID="fizica" GroupName="tip" runat="server"
AutoPostBack="true" Text="Persoana fizica"
oncheckedchanged="fizica_CheckedChanged"/>
<asp:RadioButton ID="juridica" GroupName="tip" runat="server"
AutoPostBack="true" Text="Persoana juridica"
oncheckedchanged="juridica_CheckedChanged"/><br/>

<!--. . . . . . . . . . .-->
<asp:CheckBox ID="instiintare" runat="server" AutoPostBack="true"
Text="Doresc sa fiu instiintat pe email despre noutati!"
oncheckedchanged="instiintare_CheckedChanged"/>

<!--. . . . . . . . . . .-->
<asp:Button ID="incarca" runat="server" Text="Incarca imaginea"
onclick="incarca_Click" /><br/>

<!--. . . . . . . . . . .-->

2
public partial class BasicWebControls : System.Web.UI.Page{
// procedura apelata la incarcarea paginii
protected void Page_Load(object sender, EventArgs e){
// daca pagina este la prima incarcare
// se ascunde controlul textbox email
// in controlul imagine se incarca o imagine alba
if (!IsPostBack){
fizica.Checked = true;
email.Visible = false;
imagine.ImageUrl = "~/Imagini/Blank.jpg";
}
}

// procedura apelata la modificarea starii controlului fizica


protected void fizica_CheckedChanged(object sender, EventArgs e){
// se modifica corespunzator textul din etichete
if (fizica.Checked){
lNume.Text = "nume";
lId.Text = "CNP";
}
}

// procedura apelata la modificarea starii controlului juridica


protected void juridica_CheckedChanged(object sender, EventArgs e){
// se modifica corespunzator textul din etichete
if (juridica.Checked){
lNume.Text = "denumire";
lId.Text = "CIF";
}
}

// procedura apelata la bifarea/debifarea controlului instiintare


protected void instiintare_CheckedChanged(object sender, EventArgs e){
// daca este bifat se face vizibil controlul email
// se indica in cadrul sau ca acolo trebuie scris emailul
// se pozitioneaza cursorul pe controlul email
if (instiintare.Checked){
email.Visible = true;
email.Text = "aici scrieti emailul";
email.Focus();
}
// alfel, controlul email devine vizibil
else{
email.Visible = false;
}
}

// procedura apelata la clic pe butonul incarca


protected void incarca_Click(object sender, EventArgs e){
// daca in control este incarcata o imagine
// se salveaza pe server si ulterior in controlul imagine
if (upload.HasFile){
upload.SaveAs(Server.MapPath("Imagini\\" + upload.FileName));
imagine.ImageUrl = "~/Imagini/" + upload.FileName;
}
}
}

3
1.7. Controale web ASP.NET pentru gestiunea accesului utilizatorilor

1.7.1. Crearea unei pagini de login


Controalele din zona Login a toolbox-ului permit gestiunea accesului
utilizatorilor. Controlul Login din această zonă oferă tot ceea ce este necesar
pentru logarea unui utilizator. El este bine să fie inserat într-o pagină cu numele
Login.aspx aflată în rădăcina site-ului deoarece alte controale de gestiune a
acesului caută în mod implicit această pagină.
În această pagină se oferă pe de o parte posibilitatea de logare (folosind
controlul Login) şi pe de altă parte posibilitatea de creare a unui nou cont (va fi
implementată ulterior).
După inserarea controlului, se observă că acesta diferă de controalele
Standard prin faptul că este mai complex (i.e. format din mai multe controale
simple). Textul care apare cu roşu (e.g. cele două asteriscuri) semnifică faptul că
acesta apare în browser numai în anumite circumstanţe (e.g. în cazul în care nu se
introduce date în câmpul respectiv).
O primă acţiune constă în traducerea textelor care apar, prin modificarea
proprietăţilor corespunzătoare. Ulterior, pentru modificarea aspectului controlului
poate fi accesat meniul Common Tasks, accesibil prin clic pe săgeata din colţul
dreapta-sus al controlului. Opţiunea Auto Format... permite alegerea unor aspecte
predefinite. Acest aspect poate fi particularizat şi prin modificarea proprietăţilor
controlului (împărţite pe secţiuni specifice sub-controalelor). O variantă a paginii
Login.aspx poate fi vizualizată în figura 1 -29.

figura 1-29. Exemplu de pagină pentru accesul utilizatorilor

Pentru aşezarea în pagină s-a utilizat un tabel. De asemenea, pagina de


acces este realizată pe baza MasterPage. Dacă se doreşte o configurare
suplimentară a controlului din punct de vedere a aspectului (e.g. altă poziţionare a
elementelor) atunci singura variantă este accesarea meniului Common Tasks şi
alegerea opţiunii Convert to Template. În acest caz, controlul Login este
fragmentat în controale individuale, fapt ce se poate observa în codul sursă.

2
1.7.2. Afişarea informaţiilor despre starea sesiunii
Pentru ca procedura de acces să fie cu adevărat funcţională, ar mai fi
nevoie de:
 furnizarea unei legături Login/Logout (controlul LoginStatus);
 afişarea numelui utilizatorului logat, sau nimic pentru accesul anonim (controlul
LoginName);
 afişarea unui mesaj diferenţiat pentru membrii respectiv utilizatorii anonimi
(controlul LoginView).
Toate aceste controale ar trebui amplasate în MasterPage, pentru a fi
vizibile permanent. De aceea s-a creat în banda superioară a MasterPage un tabel
cu două coloane. În prima coloană este pus controlul LoginStatus şi astfel se oferă
permanent accesul la legăturile Login respectiv Logout. În a doua coloană este pus
controlul LoginView, care în modul AnonymousTemplate afişează “Nu eşti
logat.” iar în modul LoggedInTemplate afişează “Eşti logat cu utilizatorul:”
urmat de controlul LoginName (figura 1 -30).
Controlul LoginView este foarte flexibil deoarece permite includerea altor
controale (de exemplu a controlului LoginName). De asemenea, prin editarea
proprietăţii RoleGroups a sa se pot stabili templaturi diferite pentru fiecare rol
definit în cadrul site-ului.
Pentru testare, s-a pus la proprietatea DestinationPageUrl a controlului
Login pagina Login.aspx. Aceasta înseamnă că în caz de accesare reuşită, se va
afişa tot pagina Login.aspx. Totuşi starea şi mesajele diferenţiate vor fi vizibile în
zona MasterPage.

figura 1-30. Pagina Login.aspx înainte şi după autentificare

În această figură apar în diferite ipostaze patru controale specifice: Login


în partea dreapta-jos, LoginStatus în partea stânga sus, LoginView în partea
dreapta-sus şi LoginName inclus în LoginView.

3
1.7.3. Crearea unui utilizator nou folosind controlul CreateUserWizard
Capabilităţile unui control web pot fi deosebit de puternice. Aşa de
exemplu, el poate avea acces la baza de date fără ca programatorul să fie
preocupat de detaliile de conectare, selectare a informaţiilor, etc.
Accesul la baza de date poate fi realizat atât pentru obţinere de informaţii
(controalele anterioare) cât şi pentru inserare/editare de informaţii (controalele
CreateUserWizard, Change Password, PasswordRecovery).
Pentru a demonstra capabilităţile controlului CreateUserWizard, se va
crea o nouă pagină numita CreareUtilizator.aspx. Această pagină va fi apelată la
acţionarea legăturii Creaza-ti un cont, aflată în stânga paginii Login.aspx. Această
legătură va fi implementată sub forma unui control web de tip HypeLink, având
setată proprietatea NavigateUrl în aşa fel încât să indice către pagina dorită.
În pagina CreareUtilizator.aspx trebuie inclus controlul
CreateUserWizard, cu o serie de modificări:
 Se traduc toate câmpurile implicate;
 Se alege schema Professional prin accesarea opţiunii Auto Format din meniul
Common Tasks;
 Evenimentului CreatedUser trebuie să i se asocieze codul următor care conferă
utilizatorului un anumit rol (cel de membru):

Roles.AddUserToRole(CreateUserWizard1.UserName, "membru");

 Pentru ca elementul Roles să fie identificat, este necesară importarea


namespace-ului System.Web.Security:

using System.Web.Security;

 Se specifică pagina cere să se încarce automat după crearea utilizatorului (în


cazul nostru Login.aspx) prin modificarea proprietăţii
ContinueDestinationPageUrl.

Rezultatul poate fi urmărit în figura 1 -31. În primul cadru se completează


formularul din pagina CreareUtilizator.aspx, la care s-a ajuns eventual prin
accesarea legăturii Creaza-ti un cont. În al doilea cadru suntem înştiinţaţi de crearea
cu succes a utilizatorului. În al treilea cadru se prezintă un test de logare a
utilizatorului deja creat.
Pentru fiecare control web utilizat poate fi urmărit şi codul sursă. Pe măsură
de se adaugă proprietăţi respectiv evenimente, acest cod devine din ce în ce mai
complex. De aceea este preferabil să le editaţi cu ajutorul interfeţei vizuale.

2
figura 1-31. Exemplu de creare utilizator şi logare a acestuia

1.7.4. Modificarea parolei unui utilizator


Pentru ca un utilizator să-şi modifice parola trebuie să urmeze unul din
următoarele căi:
 Dacă îşi cunoaşte parola şi este logat, să acceseze o pagină care are încărcat
controlul ChangePassword;
 Dacă şi-a uitat parola, să acceseze o pagină care are încărcat controlul
PasswordRecovery şi, pe baza răspunsului la întrebarea de securitate, să solicite
trimiterea unui email cu noua parolă.
Pentru primul caz se va crea fişierul SchimbaParola.aspx situat în
folderul FişiereleMembrilor pentru ca să nu poată fi accesat decât după logare. În
acest fişier se va introduce controlul ChangePassword. Acest fişier poate fi
accesat din pagina TestMaster.aspx, prin intermediul unei legături.
Controlului i se vor aplica anumite modificari precum: traducerea
mesajelor, schimbarea aspectului, stabilirea paginii care să se încarce după ce
schimbarea parolei a avut loc (e.g. TestMaster.aspx).
Scenariul prezentat în figura 1 -32 se compune din 4 secvenţe:
 Utilizatorul încarcă pagina TestMaster.aspx şi activează legătura Schimba
parola;
 Întrucât doreşte o pagină din folderul FisiereleMembrilor şi nu s-a autentificat
încă, este redirecţionat la pagina Login.aspx;
 După autentificare, utilizatorul este automat direcţionat la pagina pe care o
dorea anterior, adică la SchimbareParola.aspx;
 După acţionarea butonului Schimbare parola, utilizatorul este informat că
operaţiunea s-a desfăşurat cu succes;
 Dacă utilizatorul acţionează butonul Continua, este direcţionat spre
TestMaster.aspx.

3
figura 1-32. Exemplu de utilizare a controlului ChangePassword

Pentru cazul în care utilizatorul şi-a uitat parola, trebuie realizată pagina
ParolaUitata.aspx care să conţină controlul PasswordRecovery. Acest control
este relativ dificil de testat localhost deoarece are nevoie de accesul la un server
SMTP corect configurat pentru a putea trimite noua parolă pe emailul
utilizatorului. Legătura către această pagină trebuie poziţionată în pagina
Login.aspx, aşa cum este ilustrat în figura 1 -33.

figura 1-33. Adăugarea legăturii către pagina ParolaUitata.aspx

2
1.8. Controale web ASP.NET pentru navigarea în cadrul site-ului
În zona Navigation există trei controale: Menu - pentru implementarea
meniurilor; TreeView - pentru o organizare arborescentă alternativă a itemilor
meniului şi SiteMapPath - pentru vizualizarea poziţionării în cadrul site-ului.

1.8.1. Controalele Menu şi TreeView


Pentru exemplificarea funcţionalităţii acestor controale, s-au realizat
următoarele modificări la nivelul site-ului:
 S-a creat pagina Default.aspx, cu un conţinut oarecare, pentru a fi prima
pagina (Acasa) a site-ului;
 S-a creat pagina Contact.aspx, cu date de identificare ale organizaţiei.
Includerea acestor controale s-a realizat la nivelul zonei stângi a
MasterPage-ului. Din meniul CommonTasks s-a ales o anumită formatare (Auto
Format...) şi itemii care să facă parte din structură (Edit Menu Items...).
Introducerea itemilor presupune (figura 1 -34):
 stabilirea tipului nodului: Add a root item - pentru nodurile iniţiale ale
ierarhiei şi respectiv Add a child item - pentru nodurile copil; dacă este
selectat un nod copil şi se adaugă un alt nod copil, acesta va fi subordonat
nodului iniţial; există şi butoane pentru ştergerea unui item (Remove an item)
şi respective pentru mutarea în sus sau în jos a sa;
 stabilirea textului care să apară la itemul respectiv (proprietatea Text);
 stabilirea tooltip-ului asociat (proprietatea ToolTip);
 stabilirea adresei asociate (proprietatea NavigateUrl); această proprietate
trebuie să nu fie setată pentru itemii părinţi;
Aceste acţiuni sunt comune controalelor Menu şi TreeView.

figura 1-34. Adăugarea/editarea itemilor controalelor Menu şi TreeView

3
Cele două modalităţi de vizualizare sunt prezentate în paralel în figura 1
-35. Ambele controale oferă posibilităţi de expandare/contracţie a structurii.
Controlul Menu este afişat implicit contractat. Pentru a impune acelaşi
comportament şi controlului TreeView (care altfel ar fi afişat implicit expandat),
trebuie stabilită proprietatea ExpandDepth la valoarea 1.

figura 1-35. Exemplu de utilizare a controalelor Menu şi TreeView

Un aspect foarte important este posibilitatea de a stabili itemii din meniu


cu ajutorul unui fişier extern, în format XML. O asemenea abordare este foarte
flexibilă deoarece, după realizarea legăturii dintre control şi fişierul în format
XML, nu mai trebuie editat controlul ci doar conţinutul fişierului.

<?xml version="1.0" encoding="utf-8" ?>


<siteMap xmlns="http://schemas.microsoft.com/AspNet/SiteMap-File-1.0" >
<siteMapNode>
<siteMapNode url="~/Default.aspx" title="Acasa"
description="Prima pagina" />
<siteMapNode url="" title="Tehnic" description="Exemple tehnice">
<siteMapNode url="~/TestMaster.aspx" title="TestMasterPage" />
<siteMapNode url="~/ConvHTML.aspx" title="Controale HTML"/>
<siteMapNode url="~/BasicWebControls.aspx"
title="Controale web Standard" />
<siteMapNode title="Autentificare"
description="Totul despre login/logout">
<siteMapNode url="~/Login.aspx" title="Login" />
<siteMapNode url="~/CreareUtilizator.aspx"
title="Creare utilizator" />
<siteMapNode url="~/ParolaUitata.aspx" title="Obtinere parola" />
<siteMapNode url="~/FisiereleMembrilor/SchimbareParola.aspx"
title="Schimbare parola" />
</siteMapNode>
</siteMapNode>
<siteMapNode url="~/Contact.aspx" title="Contact"
description="Informatii la..." />
</siteMapNode>
</siteMap>

2
Pentru a realiza acest lucru este necesară crearea unui fişier de tipul Site
Map (opţiunea Add new item... din meniul contextual din Solution Explorer).
Fişierul trebuie denumit cu extensia sitemap (e.g. Web.sitemap). El conţine o
descriere xml a itemilor din meniu cu precizarea valorilor proprietăţilor sub forma
unor câmpuri xml, aşa cum este ilustrat în listing-ul anterior.
Pentru a crea legătura dintre un control Menu sau TreeView şi fişierul
Web.sitemap, trebuie aleasă opţiunea Choose Date Source: - <New Data
Source...> din meniul Common Tasks iar apoi trebuie indicată varianta Site Map.
Un alt aspect referitor la meniuri constă în afişarea diferenţiată a anumitor
itemi, în funcţie de rolul membrului. Aşa de exemplu, legătura către pagina
SchimbareParola.aspx ar trebui să fie disponibilă doar după autentificare, adică
doar utilizatorilor din cu rolul membru.
Această facilitate necesită mai întâi activarea posibilităţii de afişare
diferenţiată a itemilor din meniu (TrimmingEnabled) prin editarea fişierului
Web.config. Pentru aceasta, chiar înainte de eticheta </system.web>, trebuie
adăugat codul următor:

<siteMap defaultProvider="XmlSiteMapProvider" enabled="true">


<providers>
<add name="XmlSiteMapProvider"
description="Default SiteMap provider."
type="System.Web.XmlSiteMapProvider"
siteMapFile="Web.sitemap"
securityTrimmingEnabled="true" />
</providers>
</siteMap>

Ulterior, în descrierea din fişierul Web.sitemap a itemului Schimbare


parola, trebuie adăugată proprietatea roles cu valoarea membru. Aceasta
semnifică faptul că itemul respective va fi afişat doar pentru utilizatorii
autentificaţi şi având rolul membru.

1.8.2. Controlul SiteMenuPath


Oferă posibilitatea afişării poziţiei paginii curente în cadrul site-ului. El
poate fi adăugat tot în cadrul Master Page, de exemplu în partea superioară sub
controalele LoginStatus, LoginView şi LoginName. În figura 1 -36 este ilustrată
utilizarea acestui control.

figura 1-36. Exemplu de utilizare a controlului SiteMapPath

3
1.9. Controale web ASP.NET pentru validări
De multe ori apare necesitatea de a efectua verificarea datelor pe care un
utilizator le introduce într-un control dintr-un formular. Bineînţeles că toate
validările necesare pot fi realizate în cadrul unei proceduri apelate trimiterea
datelor pe server. Cu toate acestea, pentru a reduce cantitatea de cod necesară a fi
scrisă, proiectanţii ASP.NET au inclus o serie de controale de verificare.
Un control din această categorie este asociat unui alt control pe care
trebuie să-l verifice. Asocierea se realizează cu ajutorul proprietăţii
ControlToValidate. De asemenea, la client, controlul de verificare nu are o
reprezentare vizuală (nu se vede) decât în cazul în care depistează o eroare. În
acest moment, se afişează un mesaj, specificat de proprietatea ErrorMessage.
Modul în care este afişat acest mesaj se specifică prin intermediul
proprietăţii Display, care poate avea valorile Static (se indică zona de afişare a
mesajului), Dynamic (mesajul se afişează într-o zonă creată dinamic) sau None
(mesajul nu este afişat lângă control dar poate fi afişat cu ajutorul controlului
ValidationSummary).
Pentru testarea rapidă a acestor controale se poate realiza o pagina numita
Validari.aspx care să conţină controale text şi un buton care să aibă tratat
evenimentul onclick, chiar dacă corpul procedurii de tratare este vid. Controalele
de validare ce trebuie testate se asociază pe rând controalelor text iar la apăsarea
butonului, dacă anumite reguli nu sunt respectate, anumite mesaje de eroare vor fi
afişate în pagina clientului.

1.9.1. Controalele RequiredFieldValidator şi RangeValidator


Codul următor poate fi utilizat pentru includerea în pagină a unui control
text care să permită introducerea înălţimii în cm a unei persoane. Primul control
de validare (RequiredFieldValidator1) verifică existenţa unei valori. Al doilea
control (RangeValidator1) verifică tipul valorii (Integer) şi domeniul de valori
(între 20 şi 250).

<asp:TextBox ID="camp1" runat="server"></asp:TextBox>


<asp:RequiredFieldValidator ID="RequiredFieldValidator1" runat="server"
Display="Dynamic" ErrorMessage="Campul este obligatoriu."
ControlToValidate="camp1"> </asp:RequiredFieldValidator>
<asp:RangeValidator ID="RangeValidator1" runat="server" Display="Dynamic"
ErrorMessage="Valoarea trebuie sa fie intre 20 si 250"
ControlToValidate="camp1" Type="Integer"
MinimumValue="20" MaximumValue="250"></asp:RangeValidator>

Verificarea intervalului se poate realiza şi pentru alte tipuri de date decât


numere întregi (Integer) şi anume pentru date calendaristice (Date), numere cu
virgulă (Double), şiruri de caractere (String), valori monetare (Currency).

2
1.9.2. Controalele RegularExpressionValidator şi CompareValidator
Controlul RegularExpressionValidator oferă posibilitatea testării datelor
de intrare din punct de vedere al unui anumit patern aşteptat. Cu ajutorul unei
secvenţe de cod scrise în dreptul proprietăţii Validation Expression se indică
numărul de litere sau cifre aşteptate sau o anumită combinaţie. Exemplul urrmător
se referă la validarea unui câmp CNP care trebuie să fie alcătuit din exact 13 cifre.

<asp:TextBox ID="camp2" runat="server"></asp:TextBox>


<asp:RegularExpressionValidator ID="RegularExpressionValidator1"
runat="server" ControlToValidate="camp2"
ErrorMessage="CNP-ul trebuie sa fie format din 13 cifre."
ValidationExpression="\d{13}" > </asp:RegularExpressionValidator>

Controlul CompareValidator serveşte la verificarea valorii introduse din


punct de vedere al apartenenţei la un anumit tip de dată (Integer, Double, Date,
String, Currency) sau din punct de vedere al raportului (Equal, GreaterThan,
GreatherThanEqual, LessThan, LessThanEqual, NotEqual) cu o altă valoare.
În primul exemplu se doreşte introducerea unui coeficient matematic,
deci a unui număr, întreg sau cu virgulă.

<asp:TextBox ID="camp3" runat="server"></asp:TextBox>


<asp:CompareValidator ID="CompareValidator1" runat="server"
ErrorMessage="Coeficientul trebuie sa fie un numar."
ControlToValidate="camp3" Type="Double" Operator= "DataTypeCheck">
</asp:CompareValidator>

În al doilea exemplu se doreşte introducerea unei note în sistemul 1-10,


dar fără posibilitatea notei 5 (sistem practicat de unii profesori pentru a diferenţia
clar elevii restanţieri de cei promovaţi). Se utilizează un control RangeValidator
împreună cu un control CompareValidator.

<asp:TextBox ID="camp4" runat="server"></asp:TextBox>


<asp:CompareValidator ID="CompareValidator2" runat="server"
ErrorMessage="Nota trebuie sa fie diferita de 5."
ControlToValidate="camp4" Operator="NotEqual" ValueToCompare="5">
</asp:CompareValidator>
<asp:RangeValidator ID="RangeValidator2" runat="server" Display="Dynamic"
ErrorMessage="Valoare intre 1 si 10" ControlToValidate="camp4"
Type="Integer" MinimumValue="1" MaximumValue="10">
</asp:RangeValidator>

Se mai poate menţiona că în cadrul unui control CompareValidator se


poate specifica proprietatea ControlToCompare, caz în care compararea nu se mai
face cu o valoare fixă (ValueToCompare) ci cu o valoare din alt control.

3
1.9.3. Controlul CustomValidator
Uneori sunt necesare anumite validări care nu pot fi realizate cu
controalele prezentate până acum. Aşa de exemplu, se poate solicita
restricţionarea valorilor la cele divizibile cu 5. Pentru asemene cazuri, există
controlul CustomValidator. Acesta conţine proprietatea onServerValidate care
este asociată unei proceduri ce returnează adevărat sau fals. Procedura este scrisă
de programator şi poate să conţină teste oricât de flexibile.
Exemplul următor ilustrează utilizarea unui astfel de control pentru
verificarea divizibilităţii cu 5. Sunt utilizate de asemenea încă două controale de
validare pentru testarea introducerii unei valori si pentru testarea tipului valorii,
tip care trebuie să fie întreg.
<asp:TextBox ID="camp5" runat="server"></asp:TextBox>
<asp:RequiredFieldValidator ID="RequiredFieldValidator2" runat="server"
ErrorMessage="Campul este obligatoriu."
ControlToValidate="camp5"></asp:RequiredFieldValidator>
<asp:CompareValidator ID="CompareValidator3" runat="server"
ErrorMessage="Trebuie sa fie un numar intreg."
ControlToValidate="camp5" Type="Integer" Operator="DataTypeCheck">
</asp:CompareValidator>
<asp:CustomValidator ID="CustomValidator1" runat="server"
ErrorMessage="Numarul trebuie sa fie divizibil cu 5."
ControlToValidate="camp5" OnServerValidate="verificaCamp5">
</asp:CustomValidator>

protected void verificaCamp5(object source, ServerValidateEventArgs args){


// se converteste valoarea la numar intreg
Int32 i = Convert.ToInt32(args.Value);
// rezultatul logic al expresiei este asociat proprietatii IsValid
args.IsValid = (i % 5==0);
}

Mai trebuie de precizat că toate controalele de validare realizează


verificarea client-side, prin coduri JavaScript generate automat în afară de
controlul CustomValidator care implicit realizează verificarea pe server.

1.9.4. Controlul ValidationSummary


Deoarece afişarea mesajelor de eroare poate crea anumite probleme din
punct de vedere al spaţiului pe pagină, controlul ValidationSummary permite
afişarea tuturor erorilor într-un anume loc. Se poate specifica un mesaj (e.g.
Corectează următoarele erori) cu ajutorul proprietăţii headerText.
Deoarece în mod automat toate erorile din pagină apar în zona rezervată
controlului de tip ValidationSummary, este redundantă (şi probabil nedorită)
afişarea erorilor şi în dreptul controalelor. De aceea, la nivelul controalelor se
poate afişa doar un mesaj scurt de eroare sau doar un asterisc (*), urmând ca
detaliile să fie afişate în sumar. Proprietatea ShowSummary cu valorile true sau
false poate fi folosită pentru afişarea/ascunderea sumarului din program.

2
1.10. ASP.NET şi SQL server. Elemente introductive.

1.10.1. Facilităţile de gestiune ale bazelor de date oferite de VWD


Deşi SQL Server dispune de o interfaţă vizuală, foarte facilă, de gestiune
a bazelor de date, mediul de dezvoltare VWD pune şi el la dispoziţie o astfel de
interfaţă. Ea poate fi accesată cu ajutorul zonei Database Explorer care poate fi
activată din meniul View, opţiunea Database Explorer.
În această zonă, într-un format arborescent sunt prezentate conexiunile
utilizate, apoi bazele de date, iar apoi pentru fiecare din aceste elementele asociate
(Tabele, Vederi, Proceduri stocate, etc.). Implicit există conexiunea către baza de
date ASPNETDB.MDF, utilizată de mediul de dezvoltare VWD pentru gestiunea
utilizatorilor, rolurilor, etc.
Adăugarea unui tabel se realizează din opţiunea Add New Table
accesibilă din meniul contextual apărut la clic dreapta pe nodul Tables. Se oferă
accesul la o fereastră Table Definition în care pot fi precizate toate coloanele
tabelului (nume şi tip de dată). Indicarea cheii primare se realizează prin clic
dreapta pe câmpul implicat şi alegerea opţiunii Set Primary Key. În acelaşi mod
pot fi definite eventualele constrângeri (Check Constraints) respectiv eventualii
indecşii (Indexes/Keys). Pentru specificarea numerotării automate a unui câmp,
este necesară editarea proprietăţii Identity Specification a coloanei în cauză. În
cadrul acestei proprietăţi (pusă pe valoarea Yes) trebuie modificată şi proprietatea
(Is Identity) la valoarea Yes.
După definirea câmpurilor, datele pot fi introduse, editate sau şterse
printr-o fereastră de tipul Table Data, activată din meniul contextual al tabelului,
opţiunea Show Table Data. Din acelaşi meniu se poate accesa din nou fereastra
Table Definition. Pentru exemplificare, au fost create două tabele, Angajati şi
Firme, ale căror definiţii sunt prezentate în figura 1 -37.

figura 1-37. Definiţiile tabelelor Angajaţi şi Firme

Valorile de test pentru aceste tabele sunt ilustrate în figura 1 -38.

3
figura 1-38. Date de test ale tabelelor Angajaţi şi Firme

Lucrul cu vederi este în mare măsură similar cu cel cu tabele. În meniul


contextual există opţiunile Add New View, Open View Definition, Show Results,
cu semnificaţii evidente. În figura 1 -39 se prezintă modalitatea de creare a unei
vederi care să afişeze numele, prenumele, CNP-ul unui angajat precum şi numele
firmei la care lucrează.

figura 1-39. Procesul de creare a unei vederi

2
1.10.2. Utilizarea controlului DataList
Mediul de dezvoltare VWD oferă un număr mare de controale pentru
afişarea în diferite formate a datelor în baza de date. Cea mai simplă modalitate de
afişare a acestora este oferită de controlul DataList. Pentru exemplificare, se va
crea pagina TestDataList.aspx, în care se va integra acest control. Paşii urmaţi
pentru configurarea acestui control sunt în mare parte aceeaşi şi pentru celelalte
controale care au drept scop afişarea datelor din baza de date.
În primul rând trebuie specificată sursa datelor, prin indicarea opţiunii
Choose Data Source, <New data source...> din meniul Common Tasks. Ulterior
se alege varianta Database, specificându-se astfel faptul că se va lucra cu o bază
de date SQL Server. Apoi se alege şirul de conectare (Connection String) implicit.
În final trebuie specificată interogarea care va oferi datele, eventual utilizând
facilităţile vizuale de construcţie. Pentru exemplificare, s-a considerat ca sursă a
datelor vederea creată anterior (test) cu ordonarea înregistrărilor ascendent după
nume şi apoi ascendent după prenume.
În al doilea rând trebuie indicată modalitatea de afişare a datelor. Pentru
aceasta se poate alege o variantă din Auto format... completată cu opţiuni
specificate în Property Builder (ambii itemi se regăsesc în meniul Common
Tasks). Pentru exemplificare s-a stabilit afişarea tabelară, pe 3 coloane, cu ordinea
orizontală a itemilor (de la stânga la dreapta). Rezultatul poate fi observat în
figura 1 -40.

figura 1-40. Exemplu de utilizare a controlului DataList

1.11. ASP.NET şi SQL server. Controale avansate de gestiune a datelor.

1.11.1. Utilizarea controlului GridView


GridView este un control mai puternic decât DataList, întrucât permite
modificarea afişării datelor în mod dinamic, de către utilizatorul site-ului. Pentru
testarea acestui control s-a utilizat pagina TestGridView.aspx.

3
Stabilirea sursei datelor pentru acest control se realizează în mod identic
cu controlul DataList. Tot în meniul Common Tasks este posibilă bifarea
opţiunilor Enable Paging - paginare, Enable Sorting - sortare, Enable Selection -
selectare, cu semnificaţia că ele vor fi accesibile utilizatorului final.
Oferirea posibilităţilor de editare şi ştergere poate fi realizată prin setarea
la valoarea True a proprietăţilor AutoGenerateEditButton şi respectiv
AutoGenerateDeleteButton. De asemenea, pot fi stabilite coloanele care să fie
afişate (Edit Columns... şi Add New Columns... ).
O posibilă vizualizare a datelor, prin utilizarea controlului GridView, este
ilustrată în figura 1 -41.

figura 1-41. Exemplu de utilizare a controlului GridView

Se remarcă legăturile ce pot fi acţionate pentru a permite editarea,


ştergerea sau selectarea înregistrărilor (Edit, Delete Select) sau sortarea după
diferite câmpuri (nume, prenume, CNP, firma).

1.11.2. Asocierea unui control DropDownList cu informaţii din baza de


date
Deşi controlul DropDownList nu face parte din categoria Data, el poate fi
conectat cu valori dintr-un tabel al unei baze de date. Este necesară doar alegerea
unei surse a datelor, în mod similar cu realizarea acestei acţiuni pentru orice
control din categoria Data.
În modul Design, controlul apare marcat cu sintagma Databound, pentru
a indica faptul că este conectat la baza de date. În figura 1 -42 este ilustrat un
astfel de control, care afişează firmele ordonate ascendent după nume.

figura 1-42. Utilizarea “Databound” a unui control DropDownList

2
1.11.3. Controlul DetailsView
Acest control permite vizualizarea informaţiilor în format detaliat, pentru
fiecare înregistrare din vederea asociată. În schimb nu se mai oferă imaginea de
ansamblu asupra datelor din tabel întrucât înregistrările pot fi gestionate doar
individual. După stabilirea formatării, a sursei datelor şi a facilităţilor oferite
(paginare, ştergere, editare, inserare) într-un mod similar cu controlul GridView,
se obţine un rezultat similar cu cel ilustrat în figura 1 -43.

figura 1-43. Controlul DetailsView (vizualizare, editare, inserare)

De asemenea se poate stabili ce câmpuri să apară şi în ce ordine prin


accesarea opţiunii Edit fields... din meniul Common Tasks.

1.11.4. Utilizarea sincronizată a controalelor DropDownList, GridView şi


DetailsView
Cele trei controale pot fi amplasate pe o aceeaşi pagină, fiecare cu rolul
său: DropDownList filtrează datele, GridView le afişează iar DetailsView oferă
posibilităţi de Editare/Ştergere/Inserare.
Controlul DropDownList va conţine numele firmelor, ordonate alfabetic.
De asemenea va avea bifată proprietatea Enable AutoPostBack din meniul
CommonTasks.
Controlul GridView va conţine câmpurile vederii create anterior (nume,
prenume, CNP, firma). Pentru a realiza filtrarea datelor, se specifică pe clauza
WHERE următoarele proprietăţi:
 Column cu valoare firma, deoarece după acest câmp este realizată filtrarea;
 Operator cu valoarea =, deoarece se vor afişa numai înregistrările
corespunzătoare unei anumite firme la un moment dat;
 Source cu valoare Control, deoarece filtrarea se va realiza în funcţie de
valoare dintr-un control;
 ControlID cu valoarea DropDownList1.
După acţionarea butonului Add, clauza WHERE este specificată şi
conectarea logică a celor două controale este realizată.

3
Controlul DetailsView va conţine câmpurile din tabelul Angajati, pentru
înregistrarea selectată în GridView. Iniţial trebuie stabilită proprietatea
DataKeyName a controlului GridView la valoarea nume, pentru a oferi un criteriu
pentru selectarea înregistrării afişată în DetailsView. Ulterior trebuie realizată
conectarea controlului DetailsView cu GridView, în mod similar cu conectarea
controlului GridView cu DropDownList.
Dacă la nivelul controlului GridView se activează opţiunea de Select iar
în controlul DetailsView opţiunile Insert/Edit/Delete, grupul de controale va arăta
ca în figura 1 -44.

figura 1-44. Utilizarea sincronizată a trei controale din zona Data

Pe lângă utilizarea în mod ”vizual”, controalele din zona Data pot fi


programate din cod, obţinându-se astfel o flexibilitate sporită. Totuşi, înainte de a
trece la scrierea de cod, trebuie studiat dacă nu cumva respectiva facilitate este
deja oferită. Aşa de exemplu, posibilităţile de formatare sunt deosebit de ample,
fiecare sub-control acceptând configurare în detaliu.

1.11.5. Controlul FormView


Controlul FormView este similar cu DetailsView deoarece arată doar o
interogare la un moment dat, dar în acelaşi timp este similar şi cu controlul
DataList întrucât afişarea datelor nu se realizează neapărat într-un format tabelar.
Integrarea acestui control în cadrul aplicaţiei se realizează în aceeaşi
manieră în care se integrează şi celelalte controale din categoria Data.

2
figura 1-45. Modalitatea de afişare a datelor utilizând controlul FormView

1.11.6. Controale ASP.NET utilizator


Până în acest moment, materialul de faţă a realizat prezentarea
principalelor controale ASP.NET predefinite. Însă, pentru a extinde şi mai mult
flexibilitatea aplicaţiilor ASP.NET, există posibilitatea creării de controale
utilizator. Acestea se pot realiza eventual plecând de la alte controale şi pot fi
integrate ulterior în aplicaţie într-un mod similar cu controalele predefinite.
Pentru a crea un control nou, este necesară indicarea opţiunii Web User
Control în fereastra corespunzătoare opţiunii Add New Item... din meniul
contextual afişat în Solution Explorer.
Acest control poate fi inclus în Toolbox prin Drag and Drop într-o
categorie oarecare şi ulterior poate fi refolosit într-o pagină aspx. Totuşi este
recomandabilă crearea unei noi categorii în Toolbox (clic dreapta - Add Tab)
specială pentru organizarea separată a acestor controale utilizator.

1.12. Optimizarea site-ului web utilizând tehnologia AJAX

1.12.1. Principiile tehnologiei AJAX


Tehnologia AJAX (Asynchronous JAvascript and Xml) a apărut odată cu
WEB 2.0, ca o reacţie la dorinţa utilizatorilor de a interacţiona într-o manieră cât
mai naturală, eventual desktop style, cu aplicaţiile web.
Principalele avantaje oferite de această tehnologie se referă la:
 Posibilitatea de a defini o zonă din pagină care se modifică, şi de a realiza
doar încărcarea datelor din acea zonă, restul paginii rămânând nemodificată;
 Oportunitatea de a realiza schimb de informaţii între client-server fără
reîncărcarea efectivă a paginii.

3
Ambele avantaje se concretizează într-un aspect mai plăcut al paginii la
interacţiuni care necesită schimb de informaţii între client şi server. Pe deoparte se
reactualizează doar zona din pagină care suferă modificări iar pe de altă parte
transferul de date client-server se realizează fără ca să determine “refresh-ul”
paginii.
Din punctul de vedere al utilizatorilor de Internet, tehnologia AJAX 
permite o interfaţă grafică, cât şi un mod de prezentare a informaţiilor profesional
şi performant, permiţând accesul direct doar la informaţiile necesare utilizatorului.
În acelaşi timp, gradul de interactivitate a site-urilor ce utilizează tehnologii
AJAX este foarte ridicat. Utilizatorii au posibilitatea de a interacţiona cu site-ul,
într-un mod foarte asemănător cu aplicaţiile desktop.
Din punctul de vedere al dezvoltatorilor şi al administratorilor de reţea,
tehnologiile AJAX permit o performanţă ridicata a site-ului dezvoltat, fără a fi
necesară creşterea resurselor hardware ale sistemelor. Prin intermediul AJAX,
utilizatorii site-ului pot accesa informaţiile de care au nevoie, fără a mai fi nevoie
procesarea întregului site, a întregii interfeţe grafice, sau a tuturor modulelor
prezente într-o pagina.
La baza acestei tehnologii stă JavaScript, şi în principal obiectul
XMLHttpRequest. Acesta permite realizarea de interogări spre server-ul web (http
request) în mod direct, fără reîncărcarea paginii. Lista completă a tehnologiilor
implicate este prezentată în continuare:
 XHTML şi CSS pentru prezentare;
 Modelul Obiectual al Documentului (Document Object Model) pentru
afişarea în mod dynamic a interacţiunilor cu datele;
 XML şi XSLT pentru schimbul, gestiunea şi afişarea datelor;
 Obiectul XMLHttpRequest pentru realizarea comunicaţiei asincrone între
client şi server;
 JavaScript pentru a realiza legătura dintre aceste tehnologii.

1.12.2. Utilizarea controalelor ScriptManager, UpdatePanel şi


UpdateProcess
VWD oferă posibilitatea punerii rapide la punct a unei pagini care să
utilizeze tehnologia Ajax. Să considerăm de exemplu pagina care integrează trei
controale din categoria Data. La selectarea unui item din lista filtru sau la
selectarea unei înregistrări din tabel are loc o reîncărcare deranjantă a întregii
pagini.
Soluţia constă în a aduce la începutul paginii un control ScriptManager
urmat de un control UpdatePanel. Celelalte trei controale trebuie incluse în
controlul de tip UpdatePanel. La testarea paginii diferenţa este vizibilă:

2
actualizarea datelor se realizează mai rapid deoarece nu se mai reîncarcă toată
pagina şi nu mai apare fenomenul de “clipire” nici măcar în cadrul zonei indicate
de UpdatePanel.
Controlul UpdateProcess oferă posibilitatea afişării unui mesaj atunci
când încărcarea datelor dintr-un UpdatePanel durează mai mult decât un anumit
timp minim. Acest control se amplasează în pagină în locul în care se doreşte
afişarea mesajului. El se conectează cu un anume UpdatePanel prin intermediul
proprietăţii AssociatedUpdatePanelID. Tot în cadrul proprietăţilor se specifică
timpul în milisecunde după care să fie afişat mesajul (DisplayAfter), implicit setat
la 500 ms.
În spaţiul oferit de acest control pot fi amplasate mai multe elemente, cea
mai simplă modalitate de afişare a mesajului fiind un text simplu. Oricum, este
obligatorie inserarea măcar a unui text pentru că în acest fel se defineşte tag-ul
ProgressTemplate.
Pentru a putea testa funcţionalitatea acestui control, trebuie stabilită la 0
valoarea proprietăţii DisplayAfter. Altfel, datorită încărcării rapide a resurselor pe
localhost, mesajul nu ar mai fi activat. În continuare este prezentată modalitatea
de poziţionare a controalelor în codul sursă.

<asp:ScriptManager ID="ScriptManager1" runat="server">


</asp:ScriptManager>
<asp:UpdateProgress ID="UpdateProgress1" runat="server"
AssociatedUpdatePanelID="UpdatePanel1" DisplayAfter="0">
<ProgressTemplate>
Proceseaza....
</ProgressTemplate>
</asp:UpdateProgress>
<asp:UpdatePanel ID="UpdatePanel1" runat="server">

<!--. . . . . . . . . . -->

</asp:UpdatePanel>

1.13. Dezvoltarea seviciilor web în ASP.NET

1.13.1. Crearea unui serviciu web


De multe ori există necesitatea unei firme de a avea acces la anumite date
provenite de la o altă firmă. Se pune atunci întrebarea Care ar fi modalitatea cea
mai bună de acces la date?
Modalitatea trebuie să fie ieftină în sensul că să nu necesite noi aplicaţii
nici pe partea de client şi nici pe partea de server. De asemenea ea trebuie să fie
sigură, acest lucru referindu-se în special la furnizarea accesului doar exact la
datele necesare.

3
Serviciile web (Web Services) reprezintă un model general de dezvoltare
a unor aplicaţii care sunt independente de platformă (sistemul de operare folosit).
Ele nu folosesc alte protocoale în afară de cele deja existente: SOAP - Simple
Object Acess Protocol şi respectiv XML - Extensible Markup Language. Acest
fapt le conferă un avantaj absolut faţă de tehnologiile similare anterioare precum
DCOM - Distributed Component Object Model , RMI - Remote Method
Invocation sau IIOP - Internet Inter-Orb Protocol.
Serviciile web utilizează HTTP (clasicul port 80) şi SOAP pentru a oferi
anumite date ale companiei in Internet. Apelurile SOAP sunt convertite server-
side în apeluri de metode, iar rezultatele sunt organizate utilizând XML şi
furnizate clientului.
Pentru crearea unui serviciu web cu în cadrul VWD, trebuie aleasă
opţiunea Add New Item ... din meniul contextual obţinut în Solution Explorer.
Ulterior se alege Web Service şi se furnizează un nume pentru acesta. Se observă
că extensia fişierului creat nu mai este .aspx ci .asmx. Codul generat este ilustrat
în listingul următor.
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Services;

[WebService(Namespace = "http://tempuri.org/")]
[WebServiceBinding(ConformsTo = WsiProfiles.BasicProfile1_1)]
// To allow this Web Service to be called from script, using ASP.NET AJAX,
// uncomment the following line.
// [System.Web.Script.Services.ScriptService]
public class WebService2 : System.Web.Services.WebService {
public WebService2 () {
//Uncomment the following line if using designed components
//InitializeComponent();
}
[WebMethod]
public string HelloWorld() {
return "Hello World";
} }
Pentru crearea unor metode apelabile de la distanţă este necesară crearea
de proceduri precedate de indicativul [WebMethod]. În continuare se creează
metode de conversie a exprimării temperaturii din sistemul Fahrenheit în sistemul
Celsius şi invers, în cadrul fişierului ConvertorTemperatura.asmx. Aceste metode
primesc o variabilă de tip String reprezentând valoarea temperaturii (pentru valori
care nu sunt numere întregi se poate folosi atât notaţia cu punct cât şi notaţia cu
virgulă) şi returnează o altă variabilă de tipul String reprezentând rezultatul
conversiei sau mesajul “Invalid number!”.

2
// converteste o temperatura exprimata in grade Fahrenheit
// intr-o temperatura exprimata in grade Celsius
[WebMethod]
public string ConvFahrenheitLaCelsius(String strFahr) {
// variabila pentru pastrarea valorii numerice
double dblFahr = 0;
// rezultatul conversiei de la String la double
bool rezultat = true;
// se elimina spatiile albe
strFahr.Trim();
// se converteste de la formatul cu virgula
// la formatul cu punct
strFahr.Replace(",",".");
// se incearca realizarea conversiei
try{
rezultat = Double.TryParse(strFahr,out dblFahr);
}
// daca apare exceptie, rezultatul va fi false
catch(System.ArgumentException e){
rezultat = false;
}
if (!rezultat)
return "Invalid number!";
else
return ""+(((dblFahr-32)/9)*5);
}
// converteste o temperatura exprimata in grade Celsius
// intr-o temperatura exprimata in grade Fahreinheit
[WebMethod]
public string convCelsiusLaFahrenheit(String strCels)
{
double dblCels = 0;
bool rezultat = true;
strCels.Trim();
strCels.Replace(",", ".");
try{
rezultat = Double.TryParse(strCels, out dblCels);
}
catch (System.ArgumentException e){
rezultat = false;
}
if (!rezultat)
return "Invalid number!";
else
return "" + (dblCels * 9 / 5 + 32);
}

1.13.2. Utilizarea unui serviciu web


Pentru testarea acestui serviciu web, pagina ConvertorTemperatura.asmx
poate fi încărcată într-un browser ().

3
figura 1-46. Interfaţă cu serviciul web ConvertorTemperatura.asmx

Urmărirea legăturii Service Description


(http://localhost:1060/PrimulSite/ ConvertorTemperatura.asmx?WSDL)
furnizează o descriere WSDL (Web Service Description Language) în format
XML a serviciului web. În acest format sunt descrise datele de intrare şi respectiv
de ieşire, tipul şi denumirea lor. Această descriere este necesară atunci când se va
dori accesarea serviciului web în mod automat dintr-o altă pagină.
Pentru accesarea efectivă a metodelor, există două legături dedicate.
Prima dintre ele (http://localhost:1060/PrimulSite/ConvertorTemperatura.asmx?
op=ConvFahrenheitLaCelsius) determină afişarea paginii ilustrate în .

figura 1-47. Accesarea operaţiei ConvFahrenheitLaCelsius

În funcţie de numele şi numărul parametrilor metodei apelate, se afişează


câmpurile text corespunzătoare. După introducerea unei valori numerice
(întreagă, zecimală cu punct sau zecimală cu virgulă) se oferă un răspuns,
bineînţeles în format XML. La introducerea unei valori eronate, se afişează
”Invalid number!”.

2
figura 1-48. Rezultatul metodei ConvFarenheitLaCelsius (100)

Utilizarea unui serviciu web într-o pagina (e.g. TestConvertor.aspx)


presupune mai multe etape. În primul rând este necesară crearea paginii în care va
fi utilizat serviciul web, această pagină ar trebui să conţină următoarele controale:
 Două butoane radio, cu textele Converteste Celsius la Farenheit şi respectiv
Converteşte Farenheit la Celsius, numite rbCF şi respective rbFC;
 Un câmp text pentru introducerea valorii iniţiale a temperaturii (txtTemp);
 O etichetă necesară afişării rezultatului (lblRezultat).
 Un buton (btnApeleaza) care să declanşeze apelul.
În al doilea rând este necesară crearea în cadrul soluţiei a unei referinţe
pentru respectivul serviciu web (Add Web Reference... din meniul contextual din
Solution Explorer). Se solicită definirea locaţiei serviciului web ce se doreşte
utilizat (soluţia curentă, maşina locală, reţeaua, locală) după care se afişează
serviciile web disponibile (figura 1 -49).

figura 1-49. Căutarea serviciilor web disponibile


Ulterior este solicitat un nume pentru această referinţă (e.g. localhost)
pentru că prin intermediul acestui nume se va apela serviciul web. După
acţionarea butonului Add Reference, în Solution Explorer pot fi identificate mai
multe modificări ().

3
figura 1-50. Adăugarea în proiect a unei referinţe către serviciul web

În al treilea rând este necesară apelarea metodelor serviciului web din


cadrul paginii TestConvertor.aspx, la acţionarea butonului btnApeleaza.

protected void btnApeleaza_Click(object sender, EventArgs e)


{
// se creaza un obiect al clasei localhost.WebService
// localhost fiind numele referintei
// iar WebService fiind numele clasei (WebService.cs)
localhost.WebService ws = new localhost.WebService();
// in functie de care buton radio este bifat
// se executa una din cele doua metode
// iar rezultatul este afisat in controlul de tip Label
if (rbCF.Checked)
lblRezultat.Text = ws.convCelsiusLaFahrenheit(txtTemp.Text);
if (rbFC.Checked)
lblRezultat.Text = ws.ConvFahrenheitLaCelsius(txtTemp.Text);
}

Uşurinţa şi naturaleţea în utilizarea serviciilor web rezultă prin faptul că,


din punct de vedere al programatorului care le utilizează, acestea se comportă ca
nişte clase locale obişnuite. Toate detaliile tehnice legate de comunicarea
parametrilor, descrierea serviciului, extragerea rezultatului rămân invizibile
programatorului.

1.14. Gestiunea datelor folosind XML şi ASP.NET


În cadrul .NET Framework, există un puternic suport pentru lucrul cu
datele în format XML. Acest suport este concretizat prin următoarele facilităţi:

2
 Namespace-ul XML, cu o multitudine de clase necesare procesării datelor în
acest format;
 Designer-ul XML, instrument integrat în VWD pentru facilitarea scrierii şi
editării documentelor XML şi respectiv XSL;
 Controlul web XML, utilizabil pentru formatarea rapidă a datelor;
 Accesul la modelul obiectual al documentelor XML (XML Document Object
Model).

1.14.1. Namespace-ul XML


În cadrul namespace-ului System.Xml se găsesc numeroase clase necesare
prelucrării datelor în format XML. Dintre acestea, cele mai importante sunt:
 XmlTextReader oferă acces unidirecţional la un stream XML, cu verificarea
sintaxei;
 XmlTextWriter oferă posibilitatea de creare a unui stream XML conform cu
specificaţiile W3C XML 1.0;
 XmlDocument asigură facilităţi de navigare şi editare a nodurilor unui
document XML; Este cea mai utilizată clasă din acest namespace datorită
interfeţei foarte uşor de utilizat pe care o creează între program şi
documentul XML; Crează o reprezentare obiectuală în memorie a fişierului
fără însă a oferi posibilităţi de modificare a structurii acestuia;
 XmlDataDocument asigură legătura datele din bazele de date relaţionale şi
cele în format XML; De asemenea oferă suport pentru sincronizarea
conţinutului bazei de date cu documentul XML;
 XmlPathDocument oferă acces în citire pentru un document XML utilizând
XSLT; Deoarece această clasă nu verifică conformitatea cu W3C DOM,
crearea unei instanţe a unui document XML devine mai rapidă;
 XmlNodeReader permite accesul la datele reprezentate prin obiecte ale
claselor XmlDocument sau XmlDataDocument;
 XslTransform asigură suport pentru conversia formatului unui document
XML pe baza unei foi de stiluri XSL.
Pentru crearea documentelor XML sau XSL în cadrul VWD este necesară
indicarea opţiunii corespunzătoare din fereastra Add New Item... afişată din cadrul
zonei Solution Explorer.
Opţiunile specifice editoarelor performante (formatarea contextuală a
elementelor sintactice atomice, indicarea meniului pentru auto-completare) sunt
accesibile şi pentru aceste formate de documente.

3
1.14.2. Controlul web ASP.NET XML
Acest control vine în întâmpinarea nevoii de a afişa datele dintr-un fişier
.xml conform unei descrieri dintr-un fişier .xsl. Proprietăţile acestui control sunt:
 DocumentSource indică URL-ul sau calea către documentul XML;
 TransformSource se referă la URL-ul sau calea către foaia de stiluri XSLT;
 Document oferă posibilitatea specificării în timpul rulării (runtime) unei
referinţe către o instanţă a clasei XmlDocument;
 Transform permite specificarea în timpul rulării a unei instanţe a clasei
XmlTransform.

2
Referinţe

[1]. Martin J., Tomson B. Introducere în ASP.NET, Editura Teora, 2005.


[2]. Ahmed M., Garret C. et all. ASP.NET Web Developer’s Guide, Syngress
Press, 2006.
[3]. Simpson A., Visual Web Developer 2005 Express Edition, Wiley
Publishing Press, 2006.
[4]. Esposito D., Soluţii Web cu ASP+ADO.NET, Editura Teora, 2003.
[5]. www.microsoft.com

S-ar putea să vă placă și