1 IntroductionASP.NET est la partie du Framework Microsoft .NET ddie au dveloppement des applications web. Le Framework .NET est constitu de deux parties : une librairie de classes et le CLR (Common Runtime Language). Il existe 5 versions du Framework .NET : 1.0, 1.1, 2.0, 3.0 et 3.5. Les versions 1.x sont obsoltes. Nous tudierons ici la version 3.5.

1.1

La Librairie de classes

Le Framework .NET contient des milliers de classes que vous pouvez utiliser pour dvelopper vos applications. Parmi ces classes, on peut citer par exemple la classe File utilise pour manipuler des fichiers, la classe Graphics utilise pour manipuler des images de diffrents formats ou la classe SmtpClient utilise pour envoyer du courrier avec le protocole SMTP. Ce ne sont que quelques exemples, le Framework .NET contient environ 13000 de ces classes ! Vous pouvez obtenir une liste dtaille de ces classes avec leur documentation cette adresse : http://msdn2.microsoft.com/en-us/library/ms229335.aspx Pour information, le Framework 2.0 contient 18619 types, 12909 classes, 401759 mthodes et 93105 proprits publiques. Les Frameworks suivants en contiennent beaucoup plus. Evidemment, il faut connatre parfaitement toutes ces classes.

1.2

Rappel

Chaque classe contient des proprits, des mthodes et des vnements. Les proprits, mthodes et vnements de la classe sont appels les membres de la classe. Par exemple, voici quelques membres de la classe SmtpClient : Proprits : Host : Le nom ou ladresse IP du serveur mail Port : Le numro du port sur le serveur Mthodes : Send : Envoie un mail de faon synchrone SendAsync : Envoie un mail de faon asynchrone vnements SendCompleted : Se produit quand lenvoi dun mail de faon asynchrone est termine.

1.3

Les Namespaces

Fort heureusement, Microsoft a divis les classes du Framework en entits nommes Namespaces (espaces de nom en franais). Un namespace est une sorte de bote dans laquelle des classes ayant (plus ou moins) rapport entre elles sont regroupes. Par exemple, les classes utilises pour accder a un serveur SQL Server sont regroupes dans un namespace nomme System.Data.SqlClient . Autre exemple, toutes les classes utilises par ASP.NET sont regroupes dans un namespace System.Web.

1.4

Les Assemblies

Une Assembly (assemble en franais) est un fichier DLL dans lequel les classes sont stockes. Par exemple, les classes utilises par le namespace System.Web sont stockes dans un fichier System.Web.dll. Pour faire lanalogie (en gros) avec Java, on pourrait dire que les classes du Framework .NET sont regroupes en namespaces, (les packages), eux-mmes regroups en assemblies (les .jar). Tout comme en Java, pour pouvoir utiliser une classe, il faut configurer lapplication (nous verrons comment plus tard) pour quelle rfrence la bonne assembly, puis importer le namespace de la classe.

1.5

CLR

La seconde partie du Framework .NET est le Common Language Runtime. Le Common Language Runtime (CLR pour les intimes) se charge de lexcution de votre code. Quand vous crivez une application pour le Framework .NET avec un langage comme C# ou Visual Basic .NET, votre source nest jamais compil directement en binaire. Le compilateur C# ou VB convertit votre code dans un langage spcial nomme MSIL (Microsoft Intermediate Language, Langage intermdiaire Microsoft en franais). Les familiers de Java sont ici en terrain connu. MSIL est une sorte dassembleur orient objet ( ! ), mais la diffrence dun assembleur, il nest pas spcifique un CPU, il est indpendant de la plate forme sur laquelle il tourne. Lorsque lapplication est excute, le MSIL est compile alors (en temps rel) en binaire (donc ici spcifique a la plateforme) par le JITTER (Just-In-Time compilER). En fait, toute lapplication nest pas compile en binaire. Seules les mthodes appeles durant lexcution sont compiles.

En ralit, le Framework .NET ne comprend quun seul langage : MSIL. Cependant, Microsoft va vous pargner cette tache ingrate en vous permettant de dvelopper vos applications en Visual Basic .NET ou C#, les compilateurs MSIL de ces langages tant inclus dans le Framework .NET. Dautres langages existent cependant (soit libres, soit commerciaux), on peut citer : Cobol, Eiffel, Fortran, Pascal, Python, etc. (Dvelopper un site Web 2.0 en Cobol, avouez que ce n'est pas banal). Les premires versions du Framework taient galement livres avec un compilateur Script (Le JavaScript Microsoft) et J# (Langage Java), mais il semble que ces langages ne soient plus soutenus dans les versions rcentes. Dans les faits, les dveloppeurs utiliseront C# ou Visual Basic.NET. Les vrais dveloppeurs utiliseront C#.

Un petit mot sur la compilation ASP.NETLorsque vous crez une page web ASP.NET, vous crez en fait le code source dune classe .NET (Une instance de la classe System.Web.UI.Page). Le contenu entier de la page ASP.NET (incluant script ET contenu HTML) sont compils dans une classe .NET Quand vous appelez cette page via un browser, le Framework vrifie si une classe correspondent cette page existe. Si elle nexiste pas, il compile automatiquement cette page dans une nouvelle classe et sauve la classe compile (lassembly) dans un dossier temporaire situ (pour le Framework 2.0) cet emplacement :

\WINDOWS\Microsoft.NET\Framework\v2.0.50727\Temporary ASP.NET FilesLe 2.0.5xxx correspond la version du Framework. Plusieurs frameworks peuvent coexister et tre utiliss en mme temps sur la mme machine. Chaque Framework aura son propre dossier. Lors de la requte suivante sur cette page, la classe ne sera pas recompile. Mme si vous arrtez le serveur web et le relancez plus tard, le Framework utilisera cette classe compile (sauf si vous modifiez le fichier source, dans ce cas, elle est recompile). Quand la classe est ajoute au dossier temporaire ASP.NET, une dpendance est cre entre la classe et la page source ASP.NET. Si la page ASP.NET est modifie, la classe correspondante est automatiquement efface pour tre recompile la prochaine fois que la page sera appele. Ce procd est nomm compilation dynamique et permet des performances qui vont bien au del de ce que permettait ASP qui interprtait les pages chaque requte.

1.6

Installation du framework ASP.NET

Il y a plusieurs faons dinstaller et de dvelopper avec le framework. 1. Le systme dexploitation

Nous utiliserons pour nos dveloppements une machine fonctionnant sous Windows (2000 SP4, XP SP2-3, Vista ou server), Les exemples ici utilisent XP SP3. Je prconise lutilisation de XP pro, cette version disposant en standard du serveur web IIS.

2. Activation dIISIIS (Internet Information Server) est le serveur Web de Microsoft. Une version limite (un seul site, une seule application) est livre avec Windows XP Pro / Vista. Vous utiliserez IIS si vous n'utilisez pas l'environnement de dveloppement de Microsoft qui intgre son propre serveur web ASP.NET (Cassini). (Notez que si vous utilisez Windows XP ou Vista Home Edition, vous n'aurez pas le choix, IIS n'tant pas intgr au systme.) Si vous utilisez XP Pro, pour activer IIS : Panneau de Contrle, Ajouter / Supprimer des programmes, cliquez sur Ajouter / Supprimer des composants Windows, puis cochez la case Internet Information Services (IIS)

(Note : Tous les exemples et les copies dcrans ont t ralises sur une version US de Windows XP Pro). 3. Installez le SDK du Framework .NET

Le SDK (Software Development Kit) du Framework .NET installe toutes les assemblies sur la machine, la documentation, des exemples ainsi que les compilateurs en ligne de commande. Cette tape nest pas indispensable si on utilise lenvironnement de dveloppement de Microsoft, mais je la recommande car elle contient des informations et des outils quon ne retrouve pas ailleurs. On peut tlcharger ce SDK cette adresse : http://www.microsoft.com/downloads/details.aspx?FamilyId=F26B1AA4-741A-433A-9BE5FA919850BDBF&displaylang=en

4) Lenvironnement de dveloppement On peut utiliser les outils en ligne de commande et Notepad (pour les courageux ou les masochistes), ou un IDE libre comme SharpDevelop (http://www.icsharpcode.net/OpenSource/SD/) , mais je prconise linstallation de lIDE de Microsoft : Visual Studio Web Express 2008. Visual Studio Express 2008 est un excellent IDE gratuit qui existe en 4 versions : C#, Visual Basic, C++ et Web. Les 3 premires versions sont utilises pour dvelopper des applications Windows Desktop dans ces langages respectifs. La dernire version peut tre utilise en C# ou Visual Basic et sert construire des applications web ASP.NET. Cest celle-ci qui nous intresse. Tlchargez-la cette adresse et installez-la : http://download.microsoft.com/download/0/a/c/0ac9dadd-0107-497e-a27587fc2106941b/vnssetup.exe (Les exemples donns ici utilisent la version US de Visual Studio) Apres lavoir install, vous devriez avoir quelque chose qui ressemble a :

2 La structure d'une application asp.netNous allons commencer par un exemple complexe : Afficher une page web dans laquelle se trouvent un champ de saisie et un bouton. Lutilisateur saisit son nom dans le champ de saisie, clique sur le bouton et le message Bonjour suivi de son nom est affiche en retour. Pour cet exemple nous allons utiliser des contrles ASP.NET. Nous tudierons en dtail ces contrles plus loin, pour linstant contentons-nous de les utiliser btement Profitons-en pour faire un petit tour du propritaire de Visual Studio Express Web 2008 (VS 2008 pour les inities). Commenons par crer un nouveau projet :

File -> New Web Site

Quavons-nous ici ? 1) 2) Le type de projet : En ce qui nous concerne, nous slectionnerons ASP.NET Web Site Lemplacement : on peut choisir soit le file system (un emplacement sur le disque dur, le serveur web utilis sera alors Cassini, le serveur web intgr VS 2008), soit HTTP ( choisir si on veut utiliser un site web avec IIS, nous verrons comment faire plus tard), soit FTP. Pour notre exemple, choisissez file system et un dossier de travail. 3) On choisit le langage : les gens srieux choisirons donc Visual C#.

Le projet est cre et nous arrivons dans lenvironnement de travail VS 2008. La page par dfaut cre est Default.aspx.

4 zones importantes : 1) La Toolbox [Bote outils] : ici sont affichs tous les contrles utilisables dans une page ASP.NET. Cest galement dans la toolbox que seront affichs les contrles provenant dautres diteurs que Microsoft. Cest galement dans cet emplacement quon pourra diter les proprits CSS en cliquant sur longlet CSS Properties 2) Lditeur de code. Cet diteur est wysiwyg. Vous pouvez y travailler en 3 modes : texte (vous voyez le source), Design (vous travaillez directement sur la page web) ou Split (vous voyez le source en haut et le rendu en bas) 3) La structure du projet : Les fichiers sont affichs ici sous forme arborescente. Un deuxime onglet ( Database Explorer ) est disponible, il permet de se connecter une base de donnes et den afficher le contenu directement. 4) Le panneau properties : affiche en permanence les proprits et vnements du contrle slectionn. On peut videmment modifier les proprits ici. Toute modification est automatiquement reporte dans le source et dans lcran Design et rciproquement. Allons-y ! Mettons nous en mode Design et dplaons dans la fentre un contrle TextBox , un contrle Button et un contrle Label

Belle page nest-ce pas ? On peut la visualiser tout de suite via le serveur web en cliquant sur licne Start Debugging (flche verte) Premire chose visible : Cassini, le serveur web ASP.NET intgr VS 2008 est lance. Son activit est visible dans la barre de taches :

Deuxime chose visible : une alerte demande si on autorise le debugging. Par dfaut il est dsactiv, en cliquant sur OK, on va autoriser le debugging pour ce site (nous verrons comment debugger un peu plus loin).

La page saffiche dans le navigateur par dfaut du systme (ici IE 7) :

Evidemment, cliquer sur le bouton ne fait rien, va falloir bosser un peu.

Retour a VS. On arrte le debug (bouton carre bleu Stop Debugging ). Nous allons pour cet exemple travailler uniquement en mode design. Les pros (dont nous sommes videmment) utilisent uniquement le mode Source, mais il faut bien commencer par quelque chose. Cliquez donc sur le bouton. Ses proprits saffichent droite

Si lenvie vous prend, vous pouvez modifier ici sa couleur ou sa police, intressons nous a licne Events (lclair)

Sans entrer dans les dtails pour linstant, saisissons le nom dune fonction (helloClick) pour la proprit Click, aprs avoir clique sur Entre, le source de cette fonction est affiche automatiquement.

Tapons juste la ligne suivante :

Et relanons lapplication (bouton flche verte Debug )

Saisissons un nom dans le champ de saisie et cliquons sur le bouton. Magie, le message Bonjour suivi du nom saffiche. Je vous laisse votre motion cinq minutes et je reviens pour voir un peu en dtail ce qui sest passe.

Regardons dj dans le solution explorer quoi ressemble notre projet Ce projet ASP.NET est constitu de 3 fichiers (oublions le dossier App_Data pour linstant).

Un fichier Default.aspx qui est le nom de la page web (cest ce nom qui sera dans lurl tape dans le browser). Cette page contient les contrles ASP.NET, le code HTML, en gros toute la partie prsentation de la page (ce nest pas entirement vrai, nous verrons pourquoi plus tard). Un fichier Default.aspx.cs associ la page asp.net. Ce fichier appel fichier Code Behind contient le code associ la page. Cest ici quon codera la logique ncessaire la gnration du contenu de la page. Ce code peut galement tre directement intgr dans le fichier ASPX (plus de fichier code behind dans ce cas). Ce sera souvent le cas dans nos exemples pour rendre les sources plus concis. Je prconise cependant de mettre la partie prsentation et la partie code dans deux fichiers spars. Notez que lextension du fichier est .CS (le contenu est en C#), ce sera .VB pour du code en Visual BASIC. Enfin le fichier web.config. Ce fichier est un fichier XML qui va dcrire comment doit se comporter le site web et quel est son paramtrage. Par dfaut, VS 2008 prconfigure une partie de ce fichier. (Par exemple, il nautorise pas le debugging par dfaut, do le message affich prcdemment, le fait davoir autoris le debugging modifi un paramtre dans ce fichier). On peut galement crer des dossiers et y placer les pages ASPX et ASPX.CS associes pour crer une arborescence dans le site.

OK, allons voir un peu le contenu de ces fichiers : Le fichier Default.aspx

Untitled Page A premire vue, ca ressemble beaucoup a un fichier HTML classique, deuxime vue aussi dailleurs.

O est la diffrence ? Dabord sur la 1ere ligne.

Cette ligne configure les proprits de la page. Il y en a dautres que nous verrons plus loin, retenons CodeFile qui va indiquer le nom du fichier .cs associ et Inherits le nom de la classe associe (on la retrouvera dans le fichier .cs) Suit le formulaire ASP.NET

Vous noterez qu'une page ASP.NET est *TOUJOURS* insre dans un formulaire. C'est le contenu de ce formulaire (tag ) qui est envoye au serveur, les contrles ASP.NET doivent donc tre dans ce formulaire quoiqu'il arrive. Ceci implique donc que vous ne pouvez en aucun cas placer un formulaire dans votre page ASP.NET. Avec ASP.NET oubliez donc l'existence mme du tag , vous n'y avez plus droit (et d'ailleurs, je ne vois pas ce que vous feriez avec) Suivent enfin les contrles ASP.NET

Trois contrles ASP.NET : un TextBox (champ de saisie) dont lidentifiant est TextBox1 un Button (Bouton) dont lidentifiant est Button1 et dont lvnement onclick appelle la fonction helloClick un Label (une zone de texte) dont lidentifiant est Label1

Nous allons voir en dtail tous ces contrles et leur fonctionnement. Pour juste anticiper et dgrossir un peu, disons que les contrles ASP.NET ont tous un attribut runat= "server" qui signifie que la gnration de ce contrle et ses vnements se produiront sur le serveur. Le onclick du bouton ici nest pas un vnement onclick JavaScript qui se dclenche sur le client, cest un vnement qui va excuter une fonction sur le serveur.

Puis le fichier Default.aspx.cs

using System; using System.Configuration; using System.Data; using System.Linq; using System.Web; using System.Web.Security; using System.Web.UI; using System.Web.UI.HtmlControls; using System.Web.UI.WebControls; using System.Web.UI.WebControls.WebParts; using System.Xml.Linq; public partial class _Default : System.Web.UI.Page { protected void Page_Load(object sender, EventArgs e) { } protected void helloClick(object sender, EventArgs e) { Label1.Text = "Bonjour " + TextBox1.Text; } }Quy trouvons-nous ? Une srie de directives using. Cette instruction (lquivalent du import en java) importe les namespaces utilises dans la page. En loccurrence nous nutilisons pas tous ces namespaces ici, mais VS 2008 importe par dfaut tous les namespaces de lassembly ASP.NET et Linq. Suit la dclaration de la classe _Default (nom donne par dfaut par VS). _Default est une page ASP.NET, elle hrite donc de la classe Page. (Souvenez vous que dans le fichier ASPX de la proprit Inherits="_Default" indiquant que la page ASPX allait utiliser cette classe). Enfin, cest une classe partielle, une partie de son code est automatiquement gnr par VS : vous noterez quon peut utiliser directement les contrles dfinis dans la page ASPX sans les avoir redeclars ici (ce quon

tait oblig de faire avec le Framework 1.x), cest parce quils sont dclars dans une autre partie de la classe, dans une dll non visible ici.

protected void helloClick(object sender, EventArgs e) { Label1.Text = "Bonjour " + TextBox1.Text; }On y trouve la dfinition de la fonction dcrite dans le fichier ASPX ici :

Que fait cette fonction ? Elle modifie la proprit Text du contrle Label1 (le contenu de ce label) en y plaant "Bonjour" + le contenu de la proprit Text du contrle TextBox1 (le champ de saisie). Puis une autre fonction :

protected void Page_Load(object sender, EventArgs e) { }Quest ce que cest que cette fonction ? Une page ASPX, lorsquelle est gnre sur le serveur passe par plusieurs tapes (chargement en mmoire, traitement des vnements des contrles, transformation des contrles en contrles html standards, etc.). A chaque tape de la gnration de cette page, un vnement se produit, Page_Load est lun deux. Il y a beaucoup dvnements. On peut affecter du code chacun de ces vnements. Dans 95% (voire plus), on nutilisera que lvnement Page_Load qui se produit quand la page est charge, avant que les vnements des contrles aient eu lieu. Cest dans cette fonction quon va placer gnralement tout le code qui va tre utilis dans la page et cest pour ca que VS 2008 propose par dfaut cette fonction vide, libre au dveloppeur de la remplir.

Voyons un peu quelles fonctions sont appeles lors de la gnration de la page : Page_Init : Appel lorsque lvnement Init se dclenche. Elle est appele avant toute opration sur la page. Page_Load : Pendant cet vnement, vous pouvez effectuer une srie d'actions pour crer votre page ASP.NET pour la premire fois ou rpondre aux vnements ct clients qui rsultent d'une publication. Page_DataBind : L'vnement DataBind se produit quand on veut lier des donnes la page (nous verrons cela plus tard). Page_PreRender : L'vnement PreRender est dclench juste avant que l'tat d'affichage soit enregistr et que les contrles soient affichs. Vous pouvez utiliser cet vnement pour effectuer toute opration de dernire minute sur vos contrles. Page_Unload : Une fois qu'une page a t affiche, l'vnement Page_Unload se dclenche. Cet vnement est appropri la ralisation d'un travail final de nettoyage, tel que le nettoyage des connexions ouvertes de base de donnes, la suppression d'objets ou la fermeture de fichiers ouverts. Il y en a dautres mais leur utilisation est trs spcifique. Note sur Page_Load Cette fonction est donc appele chaque fois que la page est gnre. Que ce soit la premire fois quelle est appele par le browser ou suite un vnement sur la page (un click sur le bouton va rappeler la page pour excuter le code associ au click). La proprit IsPostBack de la classe Page (dont drive notre page) permet de savoir si la page est gnre suite a sa cration initiale ou suite a un vnement sur cette page (on dit quelle est rappele ou quun postback a eu lieu). Modifions donc notre code :

protected void Page_Load(object sender, EventArgs e) { if (!IsPostBack) { Button1.Text = " Cliquez "; } else { Button1.Text = " Cliquez encore "; } }

La premire fois quon appelle cette page, le texte du bouton est Cliquez Puis, a chaque fois que lutilisateur clique sur le bouton, la fonction helloClick est appele sur le serveur, donc lvnement Load est dclench, donc la fonction Page_Load est appele, en testant la proprit IsPostBack, on saura si la fonction est appele lors de la cration initiale de la page ou si cest suite a un vnement sur la page.

Dtail sur les vnements : Lorsquune fonction est appele par un vnement, elle passe deux paramtres :

protected void Page_Load(object sender, EventArgs e)Le premier, sender est lobjet sur lequel lvnement sest produit, ici lobjet Page, dans notre fonction helloClick, se serait le bouton Button1. Ce paramtre est utile si on fait pointer plusieurs vnements sur la mme fonction. Le deuxime paramtre va varier en fonction de lvnement. Ici il ny a pas dinformation supplmentaire, le paramtre est donc un objet EventArgs (paramtres standards dun vnement). Un click sur un contrle ImageButton (un bouton qui est en fait une image) passera en paramtre a la place dEventArgs un objet ImageClickEventArgs qui contient des informations supplmentaires (par exemple les coordonnes x, y de la souris lors du click). En fait, la page ASP.NET est un contrle ASP.NET comme un autre, et ce titre, tous les contrles ASP.NET ont le mme cycle de vie et les mmes vnements (Init, Load, Prerender, Dispose, ). Vous pouvez donc associer une fonction un de ces vnements pour un contrle prcis de la page. Dans la pratique, pour viter qu'on ne sache plus trop o et quand s'excute le code, on se limitera aux vnements de la page. Un peu confus ? Ca va aller en samliorant, ne vous inquitez pas

Avant de passer aux choses srieuses, tudions notre dernier fichier, web.xml. Pour les habitues des serveurs dapplications J2EE, on peut dire que web.xml est lquivalent du fichier server.xml. Il contient la configuration de lapplication web, on peut y placer ses propres paramtres (plutt que de les parpiller dans des fichiers textes, ou dans la base de registres), on peut y placer galement les chaines de connexions sur les bases de donnes, etc. Nous nallons pas passer en revue lintgralit du paramtrage de ce fichier, nous y reviendrons au coup par coup selon les besoins. Regardons juste ce que nous aurons ventuellement modifier dans ce fichier.

AppSettingsDans cette section, nous pourrons (ventuellement) placer des paramtres utilises par notre application :

Et les lire avec la une mthode de la classe ConfigurationSettings. Ex: String val = ConfigurationSettings.AppSettings("cle");

connectionStrings

Dans cet exemple, nous dfinissons une connexion sur une base de donnes SQL Server. Nous verrons plus loin comment utiliser ces connexions.

Assemblies Ici sont dfinies les assemblies qui vont tre utilises dans lapplication web. On pourra ensuite importer avec la directive using les namespaces de ces assemblies dont nous avons besoin. Notez que si lassembly nest pas rfrence ici, limport dans la page aspx provoquera une erreur. Toujours pour faire une analogie avec Java, on peut dire que cette section est en fait le classpath. Notez galement que lassembly est dfinie par son nom suivis de paramtres optionnels comme la version (il est possible de rfrencer plusieurs versions de la mme assembly et dutiliser des namespaces provenant de plusieurs versions), la culture (ici neutral, une assembly peut tre lie a une culture particulire, par exemple en-US ou fr, elle sera utilise en fonction de la culture slectionne dans la page) et enfin une clef publique unique qui permet de vrifier que la dll correspondante na pas t remplace par une autre a linsu de ladministrateur du site. A priori, vous ne devriez pas, pour commencer, avoir besoin de bricoler dautres sections de ce fichier.

3 Les contrles ASP.NETEntrons donc dans le vif du sujet. Les contrles ASP.NET (ceux disponibles dans la toolbox et dont nous avons vu trois spcimen) sont la clef de voute dASP.NET. Un contrle ASP.NET est une classe qui sexcute sur le serveur et renvoie en retour un contenu afficher dans le navigateur. Le Framework ASP.NET inclut en standard environ 70 contrles, et des socits tierces en proposent des centaines dautres ! Ces contrles vous permettent quasiment tout, de la simple ligne de texte a la bannire de publicit en passant par le traitement de texte intgr ou le tableau affichant les donnes dune base. Ces contrles sont diviss en 8 groupes : Les contrles standards : Ils vous permettent dutiliser les lments de base des formulaires comme les boutons, les champs de saisie, les labels. Les contrles de validation : Ils vous permettent de valider un formulaire avant de soumettre ses donnes au serveur. Les contrles "riches" : Ils affichent des objets plus complexes comme les calendriers, les wizards, les boutons pour uploader des fichiers, les bannires de publicits ou les diteurs de texte Les contrles de donnes : Ils vous permettent de travailler avec des donnes comme par exemples des donnes issues dune base de donnes. Vous pouvez utiliser ces contrles pour afficher, modifier, supprimer ou ajouter des donnes. Les contrles de navigation : Ils vous permettent dafficher des lments de navigation dans le site comme les menus, les arbres ou les breadcrumbs Les contrles de login : Ils affichent des boites de login avec nom dutilisateur et mot de passe, vous permettent de modifier les mots de passe ou dafficher des formulaire denregistrement Enfin, les contrles HTML. Ils vous permettent de transformer nimporte quel tag HTML standard en control ASP.NET

3.1

Viewstate

Avant de voir les contrles en dtail, abordons une caractristique trs importante et intressante dASP.NET : le viewstate. Le protocole http, comme vous devez le savoir et un protocole stateless (sans tat) : Chaque fois que vous demandez laffichage dune page dun site, pour le serveur web, vous tes une personne compltement diffrente et nouvelle. Le Framework ASP.NET cependant permet de dpasser cette limitation du protocole http. Par exemple, si vous assignez une valeur la proprit Text dun label, comme nous lavons fait, le contrle conservera cette valeur durant toutes les requtes qui seront faites sur cette page. Pour mieux comprendre, prenons cet exemple : (Attention, pour des raisons de concision, le code qui se trouve normalement dans la page aspx.cs est ici directement dans la page aspx. Pour cela, il est juste place dans un tag

protected void btnAjout_Click(object sender, EventArgs e) { lblCompteur.Text = (Int32.Parse(lblCompteur.Text) + 1).ToString(); } Compteur Que fait cette page ? Elle est compose dun bouton et dun label initialise au dpart avec le contenu 0 . Une fonction btnAjout_Click est associe a lvnement onclick sur le bouton. Cette fonction rcupre le contenu du label, le convertit en nombre, puis ajoute 1 et finalement le resauve dans le label.

Au bout de 3 clicks :

Normalement, du moins avec des technologies web " classiques " , le contenu du label devrait rester fig sur 0 , ou alors, il faudrait envisager quelque usine gaz de bon aloi base de variable de session ou de cookie pour aller conserver la valeur quon aurait t rcuprer pralablement dans un champ cach ou dans un paramtre de lurl, bref du bricolage comme il y a 15 ans.

Pour permettre de conserver la configuration de tous les contrles ASP.NET de la page entre deux postbacks, le Framework ASP.NET utilise une astuce appele ViewState. Si vous affichez la source de la page dans le browser (Menu View -> Source) Au milieu du code html, on trouve un champ cache qui ressemble a ca :

Ce champ cach contient la valeur de la proprit Text du contrle Label (et les valeurs de toutes les autres proprits de tous les contrles ASP.NET de la page). Quand une page est renvoye au serveur, le Framework ASP.NET rcupre cette chaine, la dcode et rinitialise toutes les proprits des contrles ASP.NET de la page. De cette faon, ASP.NET conserve ltat des contrles entre deux postbacks. Par dfaut, le viewstate est activ pour chaque contrle. Si par exemple, vous changez la couleur de fond dun calendrier, la nouvelle couleur est conserve durant les postbacks suivants. Si vous slectionnez une ligne dans une liste droulante, la ligne slectionne le restera car toutes les valeurs de ces proprits sont stockes dans le viewstate. Le viewstate est un bon truc, mais finalement, parfois ca peut devenir embtant. Le champ cach __VIEWSTATE peut devenir trs gros. Mettre beaucoup de donnes dans le viewstate peut ralentir laffichage de la page et gnrer un trafic important (le viewstate fait des aller retour entre le client et le serveur a chaque postback). Mais les concepteurs ont pens tout. Chaque contrle possde une proprit nomme EnableViewState. Par dfaut est elle initialise a true. Si vous mettez la valeur de cette proprit a false, le viewstate est dsactive pour ce contrle. Ltat de ce contrle ne sera pas conserve entre deux postbacks.

Un petit exemple pour voir ce que a donne :

protected void btnAjouter_Click(object sender, EventArgs e) { Label1.Text = (Int32.Parse(Label1.Text) + 1).ToString(); Label2.Text = (Int32.Parse(Label2.Text) + 1).ToString(); } Label 1:
Label 2:
Le premier label, sur lequel on a dsactiv le viewstate, nest pas incrment, la valeur prcdente est perdue entre deux postbacks.

Maintenant, a vous de voir quand vous pouvez vous permettre de dsactiver le viewstate (si par exemple, vous rgnrez chaque postback le contenu dun contrle, il est inutile de gnrer son viewstate qui ne sera, de toute faon, pas utilis). Note : Le Framework 2.0 a introduit une nouvelle fonctionnalit appele control state. Le control state est similaire au viewstate except quil ne conserve que les informations importantes. Par exemple, le contrle GridView (qui est un tableau de donnes, nous ltudierons plus tard) utilise le control state pour stocker la ligne slectionne. Mme si vous dsactivez le viewstate, ce contrle se souviendra de la ligne slectionne. Mais il y a mieux. En plus de ltat des contrles, vous pouvez stocker vos propres valeurs dans le viewstate. Un objet ViewState est accessible dans la page. Cest une sorte de hashmap (table de hachage en franais) Exemple : ViewState["foo"] = "bar" Vous venez de stocker bar dans le champ cache __VIEWSTATE de la page. Lors du prochain postback, vous pourrez le rcuprer en faisant :

String fooValue = ViewState["foo"].toString() ;Vous pouvez, priori, stocker nimporte quoi dans le viewstate, les objets tant srialiss, mais attention, vous augmentez au passage la taille de vos pages et le volume de donnes qui transitent sur le rseau. Une alternative ca peut tre dutiliser des variables de session.

3.2

Session, Application

La variable de session s'utilise de la mme faon que la hashmap ViewState. Sauf qu'au lieu d'utiliser "ViewState", vous utilisez "Session" : Exemple : Session["foo"] = "bar" Puis, plus tard :

String fooValue = Session["foo"].toString() ;Quelle diffrence avec ViewState ? Dans ce cas, la variable "foo" est stocke en mmoire sur le serveur et non plus dans la page (au lieu d'encombrer votre page, vous encombrez la mmoire du serveur). L'avantage de la variable session, c'est qu'elle est accessible sur toutes les pages que visite l'utilisateur. Vous pouvez ainsi conserver des informations de page en page sans avoir les repasser en paramtre chaque fois. Mais qu'est ce qu'une session ? En gros, c'est le temps entre le moment ou le visiteur arrive sur une page du site et 20 minutes aprs qu'il n'ait plus donn signe de vie. A chaque fois que le visiteur fait une action, un compteur est remis zro sur le serveur. Si le compteur atteint 20 minutes, ses variables de session sont effaces de la mmoire du serveur. Vous aurez donc compris que les variables de sessions ne sont donc accessibles qu'aux pages du site visites par un seul utilisateur. Si nanmoins, vous voulez faire partager le contenu d'une variable tous les utilisateurs du site, vous utiliserez la hashmap "Application" (qui s'utilise de la mme faon) : Exemple : Application["foo"] = "bar" Puis, plus tard :

String fooValue = Application["foo"].toString() ;

Pour rsumer : Application : commun toutes les pages vues par tous les utilisateurs (disparat aprs l'arrt de l'application, c'est--dire, quand on arrte le site web dans IIS) Session : commun toutes les pages vues par un utilisateur (disparat aprs 20 minute d'inactivit) ViewState : prsent sur une seule page pour un seul utilisateur

4 Les contrles en dtailBien, maintenant, nous allons pouvoir tudier un peu plus en dtail les diffrents contrles quASP.NET propose en standard. Noubliez pas quil existe des centaines dautres contrles (gratuits ou payants) proposes par des socits tierces.

4.1

Afficher des informations

ASP.NET possde deux contrles que vous pouvez utiliser pour afficher du texte sur une page. Le contrle Label et le contrle Literal. Le contrle Literal affiche du texte brut, alors que le contrle Label propose des possibilits de formatage plus volues.

4.1.1

Le contrle Label

Si vous voulez modifier dynamiquement du texte affiche dans une page, Label est le contrle quil vous faut. Toute chaine de caractre assigne la proprit Text du contrle sera affiche par le label quand la page sera gnre. Vous pouvez afficher du texte simple mais galement du code HTML. Il y a deux faons dassigner du texte ce contrle :

Ou

texte afficherDans le deuxime cas, vous pouvez utiliser, comme vous le voyez, du code HTML. Dans votre code, vous pouvez assigner ce que vous voulez :

Label1.Text = "texte afficher";Par dfaut, le contenu affiche est gnr dans un tag . Si vous regardez le source de la page gnre, vous trouverez :

texte afficher

Ce contrle possde d'autres proprits (toutes modifiables, comme n'importe quel contrle ASP.NET dans votre code behind). Je ne cite ici que les proprits les plus importantes : BackColor BorderColor BorderStyle BorderWidth CssClass Font ForeColor Style TooTip Couleur du fond du texte Couleur de la bordure Style css de la bordure (None, Dotted, Solid, ) Epaisseur de la bordure Classe CSS associe Police utilise Couleur du texte Style CSS associe Contenu de l'attribut title

Comme avec tous les contrles ASP.NET, ces proprits sont converties en style css associe au contrle. C'est pour cela que je prconise, plutt que d'initialiser toutes ces proprits pour chaque contrle, d'utiliser plutt une classe CSS dfinie dans un fichier de style spar.

4.1.2

Le contrle Literal

Le contrle Literal est similaire au contrle Label. Vous pouvez utiliser le contrle Literal pour afficher du texte ou du HTML. Cependant, contrairement au contrle Label, le contrle Literal ne gnre pas son contenu dans un tag , il est affiche brut. Ex :

ceci est du texteGnrera

ceci est du texteSi vous modifiez la proprit Mode avec la valeur encode :

ceci est du texteGnrera

tagadaLes caractres spciaux sont encods en html, au lieu d'afficher du texte en gras, le texte "ceci est du texte" sera affich.

4.2

Saisir des donnes

ASP.NET propose plusieurs contrles pour saisir des donnes. Nous allons tudier dans cette section les contrles TextBox, CheckBox et RadioButton. Ces contrles correspondent aux types INPUT standard du HTML.

4.2.1

Le contrle TextBox

Le contrle TextBox est utilise pour afficher 3 types de champs de saisie en fonction de la valeur de la proprit TextMode : SingleLine MultiLine Password Affiche un champ de saisie sur une ligne Affiche une zone de saisie multi ligne (TextArea en HTML) Affiche un champ de saisie sur une ligne dans lequel le texte tape est cach

En plus de cette proprit, le contrle TextBox dispose des proprits suivantes (comme d'habitude, je ne cite pas toutes les proprits. Je vous laisse le soin de les dcouvrir vous-mme, je ne cite que celles que je juge les plus utiles). AutoPostBack Columns Enabled MaxLength ReadOnly Rows Wrap Dclenche automatiquement un postback quand le texte du contrle est modifi Spcifie le nombre de colonnes afficher Active / Dsactive le contrle Nombre de caractres maximum que l'utilisateur peut saisir Empche l'utilisateur de modifier le contenu du champ Nombre de lignes afficher Autorise le retour la ligne automatique quand le TextMode est initialise a MultiLine

Nous l'avons vu prcdemment, un contrle ASP.NET est une classe, a ce titre, en plus des proprits, il dispose de mthodes et d'vnements. Parmi les mthodes intressantes, citons : Focus

Place le focus par dfaut sur ce contrle

Et parmi les vnements : TextChanged Dclenche un vnement sur le serveur quand le contenu du champ a change

4.2.2

Le contrle CheckBox

Le contrle CheckBox affiche une case cocher. Notez que le contrle CheckBox a une proprit Text qui permet d'associer un texte la case a cocher. Si vous utilisez cette proprit, le texte gnre sera place dans un tag Quelques proprits intressantes du CheckBox AutoPostBack Checked Enabled Text TextAlign Dclenche automatiquement un postback quand le texte du contrle est modifie Coche par dfaut la case Active ou dsactive le contrle Affiche un texte associe a la case a cocher Indique la position du texte (Left ou Right : gauche ou droite de la case)

Comme le TextBox, le CheckBox a une mthode Focus et un vnement CheckedChanged, dclenche sur le serveur quand le case a t coche ou dcoche.

4.2.3

Le contrle RadioButton

Le contrle RadioButton s'utilise toujours dans un groupe. Un seul bouton radio peut tre slectionn la fois dans ce groupe (Le fait de slectionner un bouton dslectionne les autres). Checked Enabled GroupName Text TextAlign Slectionne par dfaut le bouton Active ou dsactive le contrle Nom du groupe du bouton (tous les boutons du groupe ont la mme valeur) Texte associ au bouton Position de ce texte

Ce contrle possde les mmes mthodes et vnements que la case cocher (CheckBox)

4.3

Envoyer un formulaire

Une fois les informations saisies, il s'agit de les envoyer sur le serveur (faire le postback). Nous avons vu plus haut qu'une page ASP.NET est en fait un grand formulaire. Ce formulaire est post sur le serveur soit lorsqu'un vnement se dclenche sur la page web, soit lorsque l'utilisateur l'envoie lui-mme via un bouton de soumission (submit button in english). Il existe trois sortes de submit buttons : Le bouton (contrle Button), le bouton Image (ImageButton) et le bouton lien (LinkButton). Ces trois boutons font exactement la mme chose (Envoyer le formulaire vers le serveur), mais ont un aspect diffrent.

4.3.1

Le contrle Button

Le contrle button gnre un objet html du type , un bouton classique. Parmi les proprits intressantes : Enabled OnClientClick CommandName CommandArgument PostBackUrl Text Active / dsactive le contrle Indiquez ici le nom d'une fonction JavaScript qui sera excute sur le client lorsque le bouton sera cliqu. Attention, il s'agit bien ici d'une fonction client. Si la fonction renvoie false, l'envoi du formulaire sur le serveur sera annul. Voir plus bas Voir plus bas Indique l'url d'une page ASP.NET vers laquelle doit se faire le postback (nous allons voir ca en dtail plus bas) Texte du bouton

Parmi les vnements intressants Click Excute la fonction associe sur le serveur quand le bouton est clique Idem, sauf que passe en paramtre le contenu des proprits CommandName et CommandArgument. Cet vnement est utilise a la place de Click quand par exemple plusieurs boutons utilisent la mme fonction lors du click. Ces valeurs peuvent tre utilises alors pour dterminer un traitement particulier.

Command

Ex : Affichage de l'heure

protected void btnSubmit_Click(object sender, EventArgs e) { lblTime.Text = DateTime.Now.ToString("T"); }
Notez bien que le s'excute sur le serveur et que le s'execute sur le client

Le LinkButton est exactement comme un Button, la seule diffrence c'est qu'au lieu d'tre affiche sous la forme d'un bouton, il est affiche sous la forme d'un lien.

4.3.2

Le contrle ImageButton

Comme les deux contrles prcdents, le contrle ImageButton permet d'envoyer le formulaire sur le serveur, cependant, le contrle ImageButton affiche toujours une image. On retrouve les mmes proprits que prcdemment, avec, en plus : Texte a afficher si l'image n'est pas visible (navigateur texte, pour non voyant, etc) URL de l'image a afficher Utilis par les navigateurs pour non voyants : entrez ici l'url d'une page qui va dcrire l'image Alignement de l'image par rapport aux autres lments HTML (are AbsBottom, AbsMiddle, Baseline, Bottom, Left, Middle, NotSet, Right, TextTop, et Top)

AlternateText ImageUrl DescriptionUrl ImageAlign

On retrouve les mmes mthodes et vnements que les contrles prcdents. Notez que, contrairement aux deux contrles prcdents, la fonction appele par l'vnement Click ou Command ne reoit pas un paramtre EventArgs mais un paramtre ImageClickEventArgs qui indique la coordonne (x, y) a laquelle s'est produit le click dans l'image (proprits X et Y de lmageClickEventArgs). Vous pouvez utiliser cette coordonne pour faire une sorte d'image map sur le serveur.

4.3.3

Utilisation des scripts client avec les contrles boutons

Ces trois contrles ont donc une proprit OnClientClick. Vous pouvez utiliser cette proprit pour excuter du code sur le client quand le bouton est clique.

Exemple :

protected void btnDetruit_Click(object sender, EventArgs e) { lbl.Text = "Le site a ete detruit !"; } Si la fonction javascript appelle cote client renvoie false, le postback est annule et le formulaire n'est pas renvoy sur le serveur.

4.4

Postback "croiss"

Par dfaut, quand vous cliquez sur un contrle Button, le postback est fait sur la page contenant le bouton (ce qui devrait toujours tre le cas, ainsi, tout le code associ une page se trouve associ cette page). Cependant, vous pouvez parfois avoir besoin que le postback se fasse vers une autre page. Pour ce faire, vous pouvez utiliser la proprit PostBackUrl (proprit qu'on retrouve dans les trois contrles). Cette proprit contient l'URL d'une page ASP.NET, page sur laquelle se fera le postback. Dans l'exemple qui suit, la premire page contient un champ de saisie (un TextBox), l'utilisateur saisit du texte et valide, le postback se fait alors sur la deuxime page, on affiche sur cette deuxime page le texte saisi dans la premire : 1ere page

2eme page

void Page_Load() { if (PreviousPage != null) { TextBox txt = (TextBox)PreviousPage.FindControl("texte"); lbl.Text = String.Format("Texte : {0}", txt.Text); } }

Que fait-on dans cette deuxime page ? La proprit PreviousPage de l'objet Page (notre page donc) est utilise pour savoir si le Page_Load est conscutif a un postback effectue sur une autre page. Si c'est le cas, on utilise la mthode FindControl de la page. Cette mthode cherche un objet dans la page a partir de son identifiant. L'objet gnrique est alors caste sur un TextBox do on extrait le contenu de la proprit Text.

Pas trs simple n'est-ce pas ? On peut faire plus simple et plus propre. En exposant dans une proprit de la page prcdente le texte saisi par l'utilisateur :

public string Texte { get { return texte.Text; } }

Sur l'autre page, le code de la mthode Page_Load s'en trouve simplifie :

void Page_Load() { if (Page.PreviousPage != null) { lbl.Text = String.Format(Texte : {0}, PreviousPage.Texte); } } Mieux non ?

4.4.1

Spcifier le bouton par dfaut

Vous pouvez, si vous avez plusieurs boutons dans la page, spcifier lequel sera appel par dfaut si l'utilisateur appuie sur la touche "Entre". Pour cela, renseignez la proprit "DefaultButton" du formulaire de la page ASP.NET avec le nom du bouton en question.

4.5

Afficher des images

Le Framework ASP.NET dispose de deux contrles pour afficher des images : le contrle Image et le contrle ImageMap. Le contrle Image affiche btement une image, le contrle ImageMap vous permet de crer des images map (dsol, mais je ne sais pas trop comment traduire ca en franais)

4.5.1

Le contrle Image.

Il possde les mmes proprits du contrle ImageButton.

4.5.2

Le contrle ImageMap

Ce contrle vous permet de crer des images map. Les images map sont des images sur lesquelles on a dfini plusieurs zones. Vous pouvez alors effectuer des traitements particuliers en fonction de la zone clique. Par exemple, vous pouvez utiliser une image map pour faire une barre de navigation. Dans ce type d'utilisation, cliquer sur une des zones enverra l'utilisateur vers une partie ou une autre du site. Un contrle ImageMap est compos d'instances de classes HotSpot. Un HotSpot dfinit une zone cliquable dans une image map. Le Framework ASP.NET propose trois types de HotSpots : CircleHotSpot : Dfinit une zone circulaire dans une image PolygonHotSpotDefinit une zone irrgulire RectangleHotSpotDfinit une zone rectangulaire.

Exemple : une page permettant d'appeler des moteurs de recherche :

Voici les coordonnes des diffrents lments de la page :

Le contrle ASP.NET sera dfini :

4.6

Le container

Le contrle Panel vous permet de regrouper plusieurs contrles. Notez donc que si vous cachez le panel (en mettant la proprit Visible a false), vous cachez du mme coup les contrles se trouvant dedans. Parmi les proprits intressantes du Panel : Vous permet de dfinir dans quel sens le texte va tre affiche (LeftToRight : de gauche droite, RightToLeft : de droite gauche) Par dfaut, ASP.NET convertit le panel en un tag html . Si vous mettez une chaine de caractres dans cette proprit, ASP.NET gnrera a la place un GroupingText . Le fieldset est une sorte de div encadr par un cadre au bords arrondis. Il peut contenir un titre (affiche avec le tag html ), c'est le contenu de cette proprit qui est le titre du fieldset. Indique comment est align le contenu du panel (Auto : centre, Both : texte justifi droite et gauche, Left: justifi gauche, Right : justifi droite) Affiche des barres de dfilement autour du contenu du panel (Auto : n'affiche des barres de dfilement que si le contenu du panel est plus grand que le panel lui-mme, Both : affiche deux barres de defilement (vertical et horizontal) , mme si le contenu du ScrollBars panel est plus petit que le panel lui-mme, Horizontal et Vertical : affiche toujours une barre de dfilement horizontale et verticale quelque soit la taille du contenu et None : n'affiche jamais de barre de defilement : si le contenu du panel est plus grand que le panel lui-mme, il ne sera jamais visible.

Direction

HorizontalAlign

4.7

Le contrle Hyperlink

Le contrle Hyperlink est en fait un lien html. Contrairement au contrle LinkButton qui, rappelons le est un bouton ayant un aspect de lien, le contrle Hyperlink ne fait aucun postback vers le serveur. Enabled ImageUrl NavigateUrl Target Active / dsactive le contrle Spcifie une image pour le lien (le lien est en fait une image) URL du lien Spcifie la fentre de destination, le cas chant, la frame ou iframe.

5 Les contrles de validationOK, avec les contrles que vous avez vus prcdemment, vous tes capable de couvrir de faon basique la plupart des besoins des sites web. Mais ASP.NET propose d'autres contrles. Ceux-ci, plus complexes et plus riches, vous permettent de vous affranchir de dveloppements fastidieux. Parmi ces contrles, on trouve les contrles de validation. Les contrles de validation vrifient les donnes saisies par l'utilisateur et si ces donnes comportent une erreur, ne correspondent pas a un format prcis, comportent des valeurs errones ou en contradictions entre elles, affichent un message d'erreur. Le Framework ASP.NET 3.5 inclut six contrles de validation : RequiredFieldValidator : Oblige l'utilisateur saisir une donne dans un champ de saisie RangeValidator : Vrifie que la donne saisie se situe bien dans une certaine fourchette CompareValidator : Compare la donne saisie avec une valeur ou vrifie le type de la donne saisie RegularExpressionValidator : Vrifie que la donne saisie est valide en fonction en l'valuant avec une expression rgulire CustomValidator : Valide la donne saisie grce a une fonction que vous pouvez dfinir vousmmes ValidationSummary : Enfin, affiche un rsume de toutes les erreurs de validation de la page

Vous pouvez associer un contrle de validation a n'importe quel contrle de formulaire. Par exemple, si vous voulez obliger l'utilisateur a saisir une valeur dans un contrle TextBox, vous pouvez associer un contrle RequiredFieldValidator a ce contrle TextBox. Petit exemple simple : Si l'utilisateur clique sur OK sans avoir saisi de texte, le message "(Obligatoire)" s'affiche a droite du champ ou la saisie est obligatoire.

Si l'utilisateur clique sur OK aprs avoir saisi du texte, aucun message d'erreur ne s'affiche et le texte saisie est raffich sur la page :

void btnSubmit_Click(Object sender, EventArgs e) { if (Page.IsValid) { lbl.Text = "texte saisi : " + txtBox.Text; } }

Chaque contrle RequiredFieldValidator est associ avec un contrle spcifique en utilisant sa proprit ControlToValidate (on indique dans cette proprit quel contrle il va valider).

Vous noterez au passage que vous pouvez crer plusieurs contrles de validation et associer tous ces contrles le mme contrle a valider. Vous noterez aussi (notez bien, c'est important) que dans le page load, il y a un test :

if (Page.IsValid)Lorsque la validation se fait cote serveur (nous allons voir ca juste aprs), un postback est donc dclench pour revenir sur le serveur faire cette validation. Le code de la fonction Page_Load sera donc toujours excut, qu'il y ait eu une erreur ou non. Ce qui est logique, Page Load est un vnement dclench toujours lors de la gnration de la page quoi qu'il se soit passe sur la page. On teste donc la proprit IsValid de la page avant de faire un traitement particulier. Si la page ne contient aucun contrle de validation, la page sera toujours valide (Page.IsValid est toujours a true), sinon, si une erreur de validation s'est produite, il sera a false.

5.1

Utilisation de Javascript

Par dfaut, les contrles de validation effectuent leurs validations la fois sur le client (dans le navigateur) et sur le serveur. Sur le client, la validation se fait avec JavaScript. C'est tout de mme plus agrable, du point de vue utilisateur, d'avoir un message d'erreur affich immdiatement en cas de mauvaise saisie plutt que d'tre oblig d'attendre un aller-retour entre le navigateur et le serveur pour faire cette vrification. ASP.NET 3.5 supporte la validation ct client sur les navigateurs Internet Explorer, Firefox et Opera. Cependant, mme si la validation se fait ct client, lorsque les donnes seront envoyes au serveur, une nouvelle validation sera refaite ct serveur. Ceci est fait pour des raisons de scurit : une personne mal intentionne pourrait recrer un faux formulaire, supprimer les validations et envoyer les donnes au serveur non valides. C'est pour ca qu'il faut, si une validation est faite sur le client, toujours vrifier la valeur de la proprit IsValid de la Page.

5.2

La proprit Display

Tous les contrles de validations ont une proprit Display qui dtermine comment le message d'erreur sera affiche. Cette proprit accepte une de ces trois valeurs : Static Dynamic None

Par dfaut, la proprit Display a la valeur "Static" : dans ce cas, le message d'erreur sera gnr de la faon suivante : (Obligatoire) Notez que le message d'erreur est gnr dans un qui a un style css "visibility" mis a hidden. Si vous utilisez la valeur "Dynamic", le message est gnr de la faon suivante :

10) args.IsValid = false; else args.IsValid = true; }

La partie intressante est bien entendu la fonction "validation_serveur" qui va vrifier que le texte saisi fait moins de 10 caractres. Cette fonction rcupre 2 paramtres : le 1er paramtre (source) est le paramtre habituel d'un vnement, c'est le contrle qui a gnr l'vnement, en l'occurrence ici le champ texte. Le plus intressant est le paramtre "ServerValidateEventArgs". Les proprits de ce paramtre sont : Value IsValid Rcuprez la dedans la valeur a valider Mettez cette valeur a true ou false selon que la validation a russi/ chou

Simple non, et c'est aussi simple ct client :

function validation_client(source, args) { if (args.Value.length > 10) args.IsValid = false; else args.IsValid = true; }

C'est la mme chose ! La fonction JavaScript accepte les mmes paramtres et les mmes proprits. Faites votre choix ! A savoir : quand il y a plusieurs validators sur une page (un de ceux vu plus haut) et des customValidator, ces derniers seront toujours valids en dernier.

5.11 Le contrle ValidationSummary

Ce contrle affiche la liste de toutes les erreurs de validation de la page au mme endroit. Il est particulirement utile lorsque la page contient des grands formulaires. Si l'erreur s'est produit tout en bas de la page, l'utilisateur ne verra pas le message. Si vous utilisez un contrle ValidationSummary, vous pourrez afficher en haut de la page la liste de toutes les erreurs du formulaire. Vous avez peut tre not que chaque contrle de validation une proprit ErrorMessage. A quoi sert-il puisqu'on utilise la proprit Text pour afficher le message d'erreur ? Text est utilise pour afficher le message d'erreur cote du champ en erreur (par exemple "obligatoire") alors que ErrorMessage est utilis pour afficher dans le rsum des erreurs de la page (par exemple "Le champ nom est obligatoire"). Petit Exemple : on doit saisir le nom et le prnom dans ce formulaire. Si un des deux champs n'est pas renseigne, un message ("obligatoire") est affiche a cote du champ en erreur et un rsum de l'erreur est affiche en haut de la page :

Que fait ce programme ? Il vous permet de choisir une image, de l'envoyer sur le serveur, puis d'afficher sous forme d'un tableau de vignette la liste des images prsentes sur le serveur, tout ca en moins de 50 lignes.

Dtaillons d'abord la partie contrles :

On a ici un label qui affiche le texte, un contrle FileUpload et un bouton pour valider l'envoi. Quand l'utilisateur clique sur le bouton, un postback est fait et la fonction btn_Click est appele sur le serveur

La, c'est un peu plus complique, on n'a pas encore vu ce contrle, il s'agit d'un DataList, il permet d'afficher dans le format qu'on veut (dfini par le tag ItemTemplate) des donnes qu'il ira chercher dans une source de donnes qu'on lui assignera. Dans notre cas, on lui demande d'afficher sur 3 colonnes des donnes sous la forme d'une image et d'un texte.

Jetons un il au code behind :

protected void btn_Click(object sender, EventArgs e) { if (upImage.HasFile) { if (verifieType(upImage.FileName)) { String filePath = "~/dossierUpload/" + upImage.FileName; upImage.SaveAs(MapPath(filePath)); } } }Quand l'utilisateur clique sur le bouton ok donc, on arrive ici. Le premier test sert a vrifier que le contrle FileUpload a bien rcupr un fichier, on vrifie ensuite que le format du fichier est un format accept (la vrification est sommaire, a partir du nom du fichier, rien ne vous empche de faire quelque chose de plus labor), puis on sauve le nom du fichier sur le disque du serveur. Notez ici l'utilisation de la fonction MapPath. Cette fonction convertit un chemin relatif la racine du site en un chemin complet sur le disque dur du serveur. Si votre site est situe dans C:\inetpub\site et que vous faites MapPath("~/dossier/fichier"), vous obtiendrez C:\inetpub\site\dossier\fichier. N'oubliez pas de faire cette manipulation car la mthode SaveAs ne connait pas le chemin relatif du site et chouera lors de la sauvegarde. Notez galement, trs important, que vous devez donner des droits en critures sur le dossier de sauvegarde, ici "dossierUpload" l'utilisateur ASP.NET. L'utilisateur ASP.NET diffre selon le systme. Si votre site tourne sous Windows 2003 server (toutes versions), l'utilisateur est le compte "NETWORK SERVICE" (en anglais) ou "SERVICE RESEAU" sur un systme en franais. Pour les autres systmes (XP ou Vista), l'utilisateur est le compte "ASPNET".

(Exemple pour Windows XP Pro : OCTOPUS est le nom de la machine)

void Page_PreRender() { string upFolder = MapPath("~/dossierUpload /"); DirectoryInfo dir = new DirectoryInfo(upFolder); listImages.DataSource = dir.GetFiles(); listImages.DataBind(); }On retrouve ici un des vnements produits lors de la gnration de la page. Cette fonction rcupre un tableau contenant tous les fichiers d'un dossier et se sert de ce tableau comme source de donnes pour la DataList que nous avons vu plus haut. Pourquoi ne pas avoir utilise un vnement Page_Load comme d'habitude ? Souvenez-vous de l'ordre d'excution des vnements, le Page_Load se produit en premier, puis les vnements lis aux contrles sur la page. Lors du Page_Load, la fonction associe a l'vnement du bouton "Ajoute Image" n'a pas encore t excute (l'image uploade n'a pas encore t sauve dans le bon rpertoire), donc gnrer la liste ce moment n'aurait pas de sens, elle ne contiendrait pas l'image que l'utilisateur vient d'envoyer. On utilisera donc l'vnement PreRender qui se dclenche aprs les vnements des contrles, l, on est sur que l'image aura t sauve.

6.1.1

Uploader des gros fichiers

Par dfaut, vous ne pouvez pas uploader des fichiers de plus de 4 Mo. Si vous voulez dpasser cette limite, il faut modifier un paramtre dans le fichier web.xml :

Au passage, vous pouvez galement modifier le paramtre " requestLengthDiskThreshold" qui indique, en octets, la taille du buffer en mmoire o est stock le fichier avant de le transfrer dans un fichier temporaire sur le disque dur du serveur, vous pouvez augmenter cette taille pour amliorer les performances du transfert au dtriment de la taille occupe en mmoire.

6.2

Afficher un calendrier

Le contrle Calendar vous permet d'afficher un calendrier. Vous pouvez utiliser ce calendrier pour saisir une date ou pour afficher par exemple un calendrier d'vnements a venir.

Difficile de faire plus simple ?

Il affiche le calendrier dans le format et la langue du serveur Si vous modifiez une des proprits de la page (la proprit Culture) :

Magie, le calendrier s'affiche en franais !

Ce contrle propose les proprits suivantes (entre autres) : Format des jours de la semaine : DayNameFormat NextMonthText FirstLetter : 1ere lettre FirstTwoLetters : deux premires lettres Full : nom complet Short : nom abrg (lun. Mar.)

Shortest : nom trs abrg (lu ma me) Spcifie le texte qui apparait pour le mois suivant Spcifie le format du lien pour le mois suivant : CustomText : texte libre FullMonth : nom complet du mois

NextPrevFormat

PrevMonthText PrevMonthText SelectedDate SelectedDates

ShortMonth : nom abrg du mois Spcifie le texte qui apparait pour le mois prcdent Idem a NextPrevFormat (pour le mois prcdent) Renvoie ou initialise la date actuellement slectionne Si plusieurs dates sont slectionnables simultanment, renvoie ou initialise la liste

de ces dates Indiquez ici comment va se faire la slection : SelectionMode Day : un seul jour slectionnable DayWeek : ajoute un bouton en dbut de chaque semaine pour pouvoir slectionner une semaine complte DayWeekMonth : ajoute un bouton en dbut de mois pour pouvoir slectionner le mois complet SelectMonthText SelectWeekText ShowDayHeader ShowNextPrevMonth ShowTitle TitleFormat None : aucune slection possible : le calendrier sert juste a afficher Le texte (ou code html) du lien pour slectionner le mois (par dfaut, c'est > ) Le texte (ou code html) du lien pour slectionner la semaine Affiche / cache le nom des jours en haut du calendrier Affiche / cache les liens pour passer aux mois suivants / prcdents Affiche / cache le titre du calendrier Format du titre : Month : affiche le mois MonthYear : affiche le mois et l'anne Vous permet de modifier la date du jour (uniquement pour ce contrle), par dfaut, c'est la date du serveur Le calendrier sera positionn par dfaut sur le mois de cette date (sinon, il est positionn par dfaut a la date du jour) Evnement dclench chaque fois qu'un jour va tre affich dans le calendrier, spcifiez ici une fonction appeler pour afficher un contenu spcifique dans chaque journe) Evnement dclench quand un jour, une semaine ou un mois a t slectionn Evnement dclench quand le lien sur le mois suivant ou prcdent est cliqu

TodaysDate VisibleDate

DayRender SelectionChanged VisibleMonthChanged

6.3

Afficher des morceaux de pages (vues) : le contrle MultiView

Le contrle MultiView vous permet d'afficher et de cacher diffrentes parties de la page. Il est particulirement utile si vous voulez crer une page avec des onglets. Le contrle MultiView contient un ou plusieurs contrles View. Vous choisissez, via le contrle MultiView quel contrle View va tre affiche (les autres tant donc caches, car un seul contrle View peut tre affiche a la fois). Qu'est-ce qu'un contrle View ? c'est un container simple qui peut contenir n'importe quoi : du HTML standard, des contrles ASP.NET, du texte, etc Le contrle MultiView dispose des proprits suivantes : ActiveViewIndex Views GetActiveView SetActiveView ActiveViewChanged Indique ou slectionne le numro du contrle View visible Renvoie une collection des contrles View Renvoie le contrle View actuellement affiche Slectionne le contrle View qui va tre affiche Evnement dclench lorsqu'un contrle View est slectionn

Le contrle View dispose de deux vnements Activate Deactivate Petit exemple : Une liste droulante dans laquelle on choisit une vue, la vue correspondante est affiche lors de la slection. Dclench lorsqu'il est slectionn Dclench lorsqu'il est dsactiv

protected void DropDownList1_SelectedIndexChanged(object sender, EventArgs e) { MultiView1.ActiveViewIndex = int.Parse(DropDownList1.SelectedValue);

}


Vue 1
Vue 1
Vue 2
Vue 2
Vue 3
Vue 3

Notez juste la proprit "AutoPostBack=true" de la liste droulante, petit rappel, ca signifie qu'un postback aura lieu lorsqu'on slectionnera un lment de la liste, sinon, il ne se passera rien, l'vnement cote serveur ne sera pas dclench.

6.4

Afficher un formulaire en plusieurs parties

Le contrle MultiView peut galement tre utilise pour diviser un grand formulaire en plusieurs petits sous formulaires. Vous pouvez associer des commandes particulires a des boutons (en initialisant la proprit CommandName du bouton) contenus dans un MultiView, quand les boutons sont cliqus, le Multiview change seul la vue active. Vous pouvez utiliser une des quatre commandes suivantes : NextView PrevView SwitchViewByID SwitchViewByIndex Le MultiView slectionnera la vue suivante Le MultiView selectionnera la vue prcdente Le multiview selectionnera la vue dont l'identifiant est spcifi dans la proprit CommandArgument du bouton Le multiview selectionnera la vue dont le numro est spcifi dans la proprit CommandArgument du bouton

Exemple : Trois vues, avec en bas de chaque vue, des boutons de navigation vers la vue suivante ou prcdente. Sur la dernire vue, un bouton pour revenir au dbut. Tout cela sans une seule ligne de code.

Vue 1


Vue 2


Vue 3

7 Les masterpagesBien remis du chapitre sur les contrles ? Attaquons maintenant les master pages (pages maitres en franais). Une MasterPage vous permet de partager le mme contenu entre plusieurs pages du site sans avoir le recopier sur chaque page. Pour prendre un exemple simple, supposons que toutes les pages de votre site aient une entte et un pied de page identique, ce serait un peu bte de recopier cette entte et ce pied sur chaque page, vous vous rendrez vite compte que c'tait bte le jour ou vous devrez modifier une information dans le pied de page et que vous devrez rpter l'opration 300 fois. Do l'intrt de la MasterPage. Vous crez une sorte de page ASP.NET qui contient l'entte et le pied et vous indiquez o, dans cette page, le contenu va changer. Puis, lorsque vous crerez une nouvelle page ASP.NET, vous indiquerez juste que vous utiliserez cette MasterPage et vous vous proccuperez uniquement du contenu de la page. Quand elle sera gnre, l'entte et le pied seront automatiquement ajouts. Ainsi, le jour o vous voulez modifier l'entte de votre site, vous n'aurez qu' modifier votre MasterPage, toutes les pages l'utilisant seront automatiquement modifies. La MasterPage tant une page ASP.NET normale, vous pouvez y inclure tous les contrles que vous dsirez, et mme, si besoin est, communiquer entre la MasterPage et la page incluse.

7.1

Crer une MasterPage

Vous crez une MasterPage en crant un fichier dont l'extension est .master. Vous pouvez placer cette MasterPage n'importe o dans le site, vous pouvez utiliser plusieurs MasterPage dans le mme site. Une fois encore, vous pouvez placer dans une MasterPage tout ce que vous placez habituellement dans une page ASP.NET (Contrles, HTML, texte) Si vous utilisez VS2008, vous crez encore plus simplement une page en cliquant avec le bouton droit sur l'emplacement ou vous voulez la crer dans le site, puis en cliquant sur Add (Ajouter) et en choisissant "MasterPage". Il y a deux choses a savoir concernant la MasterPage. Notez qu'au lieu de l'habituelle directive qu'on trouve en haut d'une page ASP.NET et qui dfinit les proprits de la page, on trouve la directive < %@ Master @%>, notez ensuite que la MasterPage contient un nouveau contrle, le contrle PlaceHolder.

Lorsque la MasterPage est fusionne avec la page contenu, le contenu est insr a l'emplacement des contrles PlaceHolder. Petit Exemple :

Untitled Page CECI EST L'ENTETE CECI EST LE PIED DE PAGE Ceci est une MasterPage gnre par VS2008, j'y ai juste ajoute une entte et un pied de page. Qu'y trouve-ton d'intressant ?

Qui indique que c'est une MasterPage

Un contrle PlaceHolder plac dans le de la page

CECI EST L'ENTETE CECI EST LE PIED DE PAGEPuis la page elle-mme : l'entte, un contrle PlaceHolder qui contiendra le contenu de la page et le pied de page. Pourquoi avoir un autre contrle PlaceHolder dans l'entte ? Au cas ou on voudrait que la page qui va utiliser cette MasterPage veuille insrer des lments particuliers dans le de la page : script, fichier css, mta tags, etc Nous allons voir ca.

7.2

Utilisation de la MasterPage

Une fois la MasterPage cre, nous allons l'utiliser avec une page ASP.NET. Si vous utilisez VS2008 (ce que je vous conseille une fois encore), lors de l'ajout d'une nouvelle page ASP.NET (WebForm), cochez la case "Select MasterPage"

L'arborescence du site est affiche et slectionnez une MasterPage :

Et tout est fait ! La page gnre ressemble a ca :

Plutt simple non ? Qu'y trouve-t-on ? Notre directive Page est un peu diffrente :

La proprit MasterPageFile indique le chemin dans le site de la MasterPage qui va tre utilise Ensuite, on ne trouve plus de tags , , , etc puisque tout est dans la MasterPage, on trouve juste un nouveau contrle utilis deux fois : Content. Le contrle Content va contenir le contenu de votre page. La proprit importante de ce contrle est ContentPlaceHolderID. Vous y indiquez l'identifiant de contrle PlaceHolder correspondant dans la MasterPage. Ce que vous placerez dans le contrle Content "Content1" ira se placer dans le contrle PlaceHolder "ContentPlaceHolder1" de la MasterPage. Exemple : Modifions la page ASP.NET :

CECI EST LE CONTENU DE LA PAGE

Dans le PlaceHolder "HEAD" nous plaons le chargement d'un fichier de script JavaScript, dans le placeholder "ContentPlaceHolder1", nous plaons le contenu de notre page. ET voici ce qui est affich dans le browser : l'entte et le pied viennent de la MasterPage, le contenu de la page elle-mme (dont l'URL est utilise)

Et si on regarde le source de la page gnr :

Untitled Page CECI EST L'ENTETE

CECI EST LE CONTENU DE LA PAGE

CECI EST LE PIED DE PAGE On trouve dans le tag de la page notre chargement de script :

Untitled Page

7.3

Crer un contenu par dfaut

Vous avez surement remarque que vous n'tes pas oblig de remplir les contrles Content dans les pages ASP.NET utilisant une MasterPage. Si vous n'y mettez pas de contenu, rien ne sera affich dans la page gnre (ce qui est un peu normal). Mais vous pouvez crer un contenu par dfaut a un PlaceHolder de la MasterPage. Dans le contrle PlaceHolder de la MasterPage, vous crez un contenu :

CECI EST LE CONTENU PAR DEFAUT DE LA PAGE

Si, dans la page ASP.NET utilisant cette MasterPage, vous ne crez pas de contenu pour le PlaceHolder "ContentPlaceHolder1", c'est celui par dfaut qui sera utilise. Si vous crez un contenu pour ce PlaceHolder, le contenu par dfaut de la MasterPage sera automatiquement remplace par celui de la page ASP.NET

7.4

Imbriquer des MasterPage

Bien sur, une MasterPage tant une sorte de page ASP.NET, rien n'interdit une MasterPage d'avoir ellemme une MasterPage. Vous pouvez ainsi profiter d'une des nouvelles fonctionnalits de VS2008,: vous pouvez travailler en mode design avec des MasterPage imbriques, ce qui, jusqu'alors tait impossible.

7.5

Utilisation d'images et de liens dans les MasterPage

Un point important a noter : l'utilisation des images et des liens HyperText dans les MasterPage est un peu tordue lorsque vous utilisez des chemins relatifs pour vos URL. Les chemins relatifs sont interprts diffremment selon que vous utilisez ce chemin dans un tag HTML ou dans un contrle ASP.NET. Si vous utilisez un chemin relatif dans un contrle ASP.NET, l'URL est interprte relativement a la MasterPage. Par exemple, si la MasterPage est dans un dossier "MesMasterPages", et que vous avez un contrle Image dans la page :

Le serveur ira chercher l'image "/MesMasterPages/image.gif".

La situation est diffrente si vous utilisez un lment HTML standard. Si, toujours dans cette MasterPage, vous avez un lment :

Et que cette MasterPage est utilise par une page ASP.NET place dans le dossier "MesPages", le serveur ira chercher l'image "/MesPages/image.gif".

La rgle est : les chemins relatifs dans les URL utilises par des contrles ASP.NET sont relatifs la MasterPage, les chemins relatifs dans les URL utilises par des lments HTML sont relatifs la page utilisant cette MasterPage. Un peu complexe certes, mais une fois qu'on le sait

7.6

Accder a des proprits de la MasterPage a partir des pages de contenu

Pour pouvoir facilement accder a des proprits de la MasterPage partir des pages de contenu, je vous conseille d'exposer ces proprits via une proprit C# : Supposons que vous ayez un contrle Label dans la MasterPage que vous vouliez modifiez partir de la page contenu :

public string labelModifiable { get { return label.Text; } set { label.Text = value; } } La proprit Text du label que l'on veut rendre modifiable est expose via la proprit "labelModifiable" de la MasterPage.

Dans la page contenu, on trouvera :

void Page_Load() { Master.labelModifiable = "Label modifie"; }

CECI EST LE CONTENU DE LA PAGE

Dans la page contenu, on accde donc simplement a la proprit labelModifiable de la faon suivante :

Master.labelModifiable = "Label modifie";Il faut cependant noter quelque chose d'important. Par dfaut, la proprit Master de la page retourne la MasterPage de la page. La MasterPage en question est de type Page, c'est une page ASP.NET normale. Sauf que dans une page ASP.NET normale, il n'y a pas de proprit "labelModifiable", ce qui va provoquer une erreur de compilation. Pour viter cela, on a ajoute une ligne au dbut du fichier :

Que signifie-t-elle ? qu'on va typer le type Master retourn par la proprit Master avec la MasterPage indique par la proprit VirtualPath. Les proprits exposes par cette page deviennent donc visibles (et compilable par la mme occasion). Si vous trouvez la gymnastique un peu trop pnible (crer une proprit dans la MasterPage, puis ajouter un typage dans la page contenu), vous pouvez utiliser la fonction FindControl.

7.7

Utilisation de la fonction FindControl

Cette mthode demande moins de travail en amont mais je la considre comme moins propre A vous de voir. Dans ce cas, plus besoin de crer une proprit dans la MasterPage, plus besoin d'ajouter un typage dans la page contenu. On va accder directement au contrle "label" de la MasterPage a partir de la page contenu : Dans le Page_Load, on fera :

Label l = (Label)Master.FindControl("label"); l.Text = "label modifie";FindControl va aller chercher dans la MasterPage un contrle identifie par "label". La fonction renvoie un Contrle gnrique, il faut donc le caster sur un Label, puis une fois rcupre, on peut accder a toutes les proprits de ce contrle, dont la proprit Text qui nous intresse ici. A vous de voir ce que vous prfrez.

7.8

Charger des MasterPages dynamiquement

Avant de vous laisser a vos mditations sur les MasterPage, sachez que vous pouvez charger des MasterPages dynamiquement (et donc modifier a la vole la MasterPage d'une page, ce qui peut vous permettre d'avoir plusieurs habillages pour une mme page). Simplement en utilisant la proprit MasterPageFile de la page :

protected void Page_PreInit(object sender, EventArgs e) { MasterPageFile = "maMasterPage.master"; }Vous noterez que la MasterPage doit tre initialise tout au dbut de la gnration de la page. Donc l'utilisation de Page_Load n'est pas possible, il est alors trop tard et la page a dj commence a tre gnre. C'est pour ca que la slection de la MasterPage se fera lors de l'vnement PreInit qui est le tout premier vnement dclench lors de la gnration de la page, avant d'avoir fait quoi que ce soit.

8 Crer des sites web avec des thmesGrace aux thmes d'ASP.NET vous pouvez associer un style spcifique a contrle, ce style sera utilise de la mme faon sur tout le site.

8.1

Crer un thme

Pour crer un thme, il suffit de crer un dossier particulier a la racine de votre site : le dossier "App_Thmes". Chaque sous-dossier cre dans ce dossier reprsente un thme. Le dossier contiendra les fichiers dfinissant le thme : des fichiers skin et des fichiers CSS. Un thme peut contenir un ou plusieurs fichiers Skin. Un fichier Skin dfinit les proprits d'un contrle ASP.NET dont vous voulez modifier l'apparence. Par exemple, si vous voulez que tous les contrles TextBox de votre site aient un fond jaune et une bordure en pointilles, vous aller crer un Thme "MonTheme" (donc crer un dossier "MonTheme" dans le dossier "App_Themes") et dans ce dossier crer un fichier Skin "TextBox.skin". (vous pouvez nommer votre fichier Skin comme il vous plait, mais tant qu'a faire, pour s'y retrouver facilement, autant le nommer avec le nom du contrle qu'il va modifier). Dans ce fichier, on trouvera :

qui a dfini les proprits BackColor (couleur de fond) a jaune et BorderStyle (style de la bordure) en pointilles pour le contrle de type TextBox. Notez que pour dfinir le skin de ce contrle, vous devez toujours mettre l'attribut "runat=server" mais vous ne devez pas mettre d'attribut ID. Notez galement que seules les proprits ayant rapport avec l'affichage sont modifiables dans un skin (vous ne pouvez pas initialiser ici une fonction appele lors d'un vnement ou une proprit du type AutoPostBack qui fera un postback automatique si le contenu du contrle est modifi). Vous avez bien compris qu'il ne s'agit pas ici d'une page ASP.NET mais juste de la dfinition de la faon dont doit tre affiche le contrle TextBox si il se trouve dans une page qui utilise le thme "MonTheme". Vous pouvez dfinir dans ce skin d'autres contrles ASP.NET. En fait, vous pouvez vous organiser comme vous voulez : tous vos contrles dans le mme fichier skin, un fichier skin par contrle, c'est vous qui voyez

De toute faon peut importe, lors de la compilation, tous les skin seront compils et regroups dans une seule classe. Comment l'utiliser ?

Simplement en initialisant la proprit "Thme" de la page : le contrle TextBox de cette page aura un fond jaune et une bordure pointille. Que se passe-t-il si vous voulez, dans votre page, que malgr tout, un contrle TextBox n'ait pas un fond jaune et une bordure pointille mais ait une bordure pleine et un fond rouge ? Pour cela, on va ajouter dans notre fichier TextBox.skin :

Notez la proprit "SkinID", nous avons nomm notre skin. Comme ca, dans la page ASP.NET, tous les contrles TextBox auront un fond jaune et une bordure pointille sauf ceux dfini comme ceci :

Celui-ci aura une bordure pleine et un fond rouge.

Enfin, si vous dcidez de ne pas avoir de thme pour un TextBox particulier dans la page, vous utiliserez la proprit "EnableTheming" :

Et la, votre TextBox n'aura aucun thme. Cette proprit (EnableTheming) existe pour tous les contrles ASP.NET

8.2

Configurer les thmes dans le fichier web.xml

Plutt que de configurer le thme sur chaque page, vous pouvez le faire de faon globale dans le fichier web.xml :

Toutes les pages du sites utiliseront donc le thme "MonTheme". Si vous voulez cependant qu'une page en particulier n'utilise pas ce thme, vous pouvez modifier la proprit EnableTheming de la page :

8.3

Ajouter des feuilles de style CSS aux thmes

Vous pouvez utiliser les feuilles de styles CSS comme alternatives aux thmes. L'avantage tant que les feuilles de styles permettent de modifier l'apparence non seulement des contrles ASP.NET mais galement des lments HTML standards. Si vous placez une feuille de style dans un dossier de thme, cette feuille de style est automatiquement applique sur la page qui utilise ce style. Si par exemple, vous placez trois feuilles Style1.css, Style2.css et Style3.css dans le dossier "MonTheme" et que vous crez une page avec la proprit Theme = "MonTheme"

La page gnre aura dans son entte :

Je prfre cet usage des thmes plutt que la cration de fichiers skin. N'oubliez pas que chaque proprit d'affichage d'un contrle ASP.NET est en fait un style CSS. Par exemple, la proprit "BackColor=red" sera convertie en style="background-color:red;", et ceci sur CHAQUE TextBox de la page et du site, ce qui, in fine, risque de gnrer des pages trs lourdes dans lesquelles chaque lment aura une proprit "style" longue comme le bras. Je le dis ici, je le rpterai plus tard, plutt que d'utiliser toutes les proprits d'affichage des contrles ASP.NET, essayez a chaque fois que c'est possible d'utiliser un style dfini dans une feuille de style a part (et qui ne sera charge qu'une fois).

8.4

Appliquer un thme dynamiquement

On peut, comme on l'a fait avec les MasterPage, affecter un thme a la page dynamiquement :

protected void Page_PreInit(object sender, EventArgs e) { Theme = "MonTheme" }On initialise dynamiquement la proprit Thme de la page. Une fois encore, cette initialisation doit tre faite au tout dbut de la gnration de la page, donc lors de l'vnement PreInit.

9 Crer des contrles personnalises avec les Web User Controls.Un Web User Control (Contrle Utilisateur Web) vous permet de crer un nouveau contrle a partir de contrles existants. Vous n'tes donc plus limits aux seuls contrles proposs par le Framework ASP,NET. Imaginez que vous deviez, par exemple, afficher le mme formulaire pour saisir les coordonnes d'un visiteur dans de nombreux endroits de votre site. Le formulaire en question est constitu de contrles TextBox, de Labels, de contrles de validation pour vrifier que l'adresse est correctement saisie, de boutons d'envoi, etc Vous pourriez trs bien recopier ce bloc sur chaque page dans laquelle vous voulez insrer un formulaire d'adresse. Outre le fait que vous allez passer du temps le faire, vous allez tre bien embt le jour o il faudra ajouter un nouveau champ ou en supprimer un. Do l'intrt des Web User Control : vous allez placer votre formulaire d'adresse dans un Web User Control "adresse" et utiliser ce user control sur n'importe quelle page de votre site, comme si vous utilisiez un contrle ASP.NET standard.

9.1

Crer un Web User Control

Commenons par crer un simple User Control qui va juste afficher trois champs de saisie nom, prnom, email. (nous oublierons ici les contrles de validation pour ne pas alourdir l'exemple). Pour les utilisateurs de VS2008, cliquez avec le bouton droit sur le dossier dans lequel vous voulez crer votre User Control, cliquez sur Add New Item et choisissez Web User Control (nommons le "Adresse"). Vous noterez au passage qu'au lieu d'avoir une extension .ASPX comme les pages ASP.NET, le contrle a une extension ASCX. Ce fichier ASCX ne sera jamais accessible directement, il devra tre appel par une page ASPX (nous allons voir ca plus bas).

Code du contrle :

Ca ressemble beaucoup a une page ASP.NET en plus simple : La premire ligne indique les proprits du contrle la ou on trouvait les proprits d'une page. Suivent des dclarations classiques de contrles ASP.NET et d'lments HTML. On ne trouve pas ici tous les lments html d'une page (HTML, HEAD, BODY, ), ceux-ci se trouveront dans la page dans laquelle ce contrle sera inclus.

Crons donc maintenant une page:

Untitled Page Incluons-y ce contrle. Petite astuce pour commencer simplement, une fois la page cre dans VSNET 2008, placez-vous en mode design, puis faites un drag and drop du fichier ASCX prsent dans l'arborescence de votre site directement sur la page. Vous voyez instantanment le contrle s'afficher dans la page !

Mieux, revenez en mode "Source" et toutes les initialisations ont t faites pour vous :

Untitled Page Que trouvons-nous de nouveau dans notre page ? Une nouvelle ligne est apparue :

Cette ligne enregistre le User Control dans la page. Trois proprits sont initialises : src tagname Le chemin du contrle ASCX Le nom avec lequel nous allons utiliser ce contrle dans la page. Vous pouvez utiliser n'importe quoi, tant qu' faire autant utiliser le nom du fichier. Le namespace XML qui va tre utilis pour ce contrle. Encore une fois on peut utiliser n'importe quelle chaine de caractre. VS2008 utilise par dfaut uc1, si vous ajoutez un autre user control dans la page, son tagprefix sera uc2, puis uc3 et ainsi de suite (on va voir comment l'utiliser juste en dessous) Plus bas dans la page, on trouve la dclaration du user control :

tagprefix

Il est dclar comme un contrle ASP.NET standard : ID est sont identifiant, on retrouve la proprit runat. Notez que le tagprefix et le tagname sont utilises ici pour dclarer le contrle.

9.2

Dclarer un user control dans web.xml

Si vous utilisez un usercontrol souvent, plutt que de le dclarer dans chaque page avec la directive Register, vous pouvez le faire au niveau du fichier web.xml.

Et pour l'utiliser dans votre contrle SqlDataSource :

Il y a un autre avantage stocker la chaine de connexion un seul endroit. Le Framework va placer les connexions dans un pool. A chaque fois qu'une connexion est demande, plutt que d'en recrer une autre, il va aller chercher dans le pool si la connexion n'a pas dj t pralablement cre et ouverte et si c'est le cas, l'utilisera. La clef de recherche dans le pool est la chaine de connexion, si vous accdez a la mme base avec

une chaine variant lgrement (un caractre en plus ou en moins, un espace supplmentaire), une nouvelle connexion sera cre. Centraliser les chaines de connexion assure donc leur unicit.

10.3 La mme chose par programmationNous venons de voir comment faire le data binding de faon dclarative directement dans la page ASP.NET. Nous pouvons faire la mme chose par programme :

protected void Page_Load(object sender, EventArgs e) { String cnx = ConfigurationManager.ConnectionStrings["films"].ConnectionString; SqlDataSource ds = new SqlDataSource(cnx, "select id, nom from cinema"); listeFilms.DataTextField = "nom"; listeFilms.DataValueField = "id"; listeFilms.DataSource = ds; listeFilms.DataBind(); }

Nous avons enlev le contrle SqdDataSource de la page ASP.NET, et supprim toute les rfrences a cet objet dans le contrle RadioButtonList, puis, dans le source associe a la page : Ici nous allons chercher la chaine de connexion dans la section ConnectionStrings du fichier web.config. On accde aux chaines en utilisant leur nom comme index du tableau.

String cnx = ConfigurationManager.ConnectionStrings["films"].ConnectionString;

Ici on cre la datasource, au passage on indique la requte select associe a cette data source :

SqlDataSource ds = new SqlDataSource(cnx, "select id, nom from cinema");Ici on initialise notre radiobuttonlist, en indiquant quel champ de la table va tre le champ texte, quel champ va tre le champ valeur et quelle est la data source

listeFilms.DataTextField = "nom"; listeFilms.DataValueField = "id"; listeFilms.DataSource = ds;Enfin, on initialise les donnes de la liste en allant aller les chercher via la connexion. En faisant un data bind, la requte select de la connexion est appele, et le rsultat initialise le contrle associe.

listeFilms.DataBind();Facile ! Une fois affiche, il faut rcuprer les donnes slectionnes par l'utilisateur : SelectedIndex SelectedItem SelectedValue Rcupre l'index de la ligne slectionne Recupere l'item complet Recupere la valeur slectionne

(Notez que selectedindex et selectedvalue fonctionnent en lecture et en criture, vous slectionnez un item particulier de la liste en initialisant la proprit selectedindex ou selectedvalue).

Petit exemple :

protected void listeFilms_SelectedIndexChanged(object sender, EventArgs e) { Label1.Text = "Le film n." + listeFilms.SelectedIndex + " a ete selectionne : " + listeFilms.SelectedItem.Text + " (" + listeFilms.SelectedValue + ")"; }

Quelles sont les changements ? La liste d'abord, on a initialis deux nouvelles proprits :

onselectedindexchanged="listeFilms_SelectedIndexChanged"Une fonction est affecte a l'vnement selectedindexchanged. Cet vnement se produit lorsqu'on clique sur un des boutons de la liste (en fait lorsqu'on change l'index de la slection).

AutoPostBack="True"Que nous avons dj rencontr plus haut : le fait de cliquer sur un des radio buttons va provoquer un postback (ncessaire pour retourner sur le serveur pour excuter notre fonction associe au click)

Et enfin notre code C#

protected void listeFilms_SelectedIndexChanged(object sender, EventArgs e) { Label1.Text = "Le film n." + listeFilms.SelectedIndex + " a ete selectionne : " + listeFilms.SelectedItem.Text + " (" + listeFilms.SelectedValue + ")"; }La fonction se contente de rcuprer l'index de la slection (commence toujours a 0), le texte de l'lment slectionn et sa valeur :

Nous allons donc maintenant faire le tour de tous les contrles ASP.NET supportant le data binding, ce premier tour d'horizon n'utilisera que la commande SQL Select (nous lirons donc uniquement les donnes pour les afficher). Nous les modifierons par la suite. Commenons avec les autres contrles ListControl.

Nous avons vu que la RadioButtonList fait partie de cette famille. Il y a d'autres membres qui fonctionnent exactement de la mme faon, il suffit juste de remplacer le nom du contrle. Exemple, vous voulez une liste droulante a la place de la liste de boutons radio ? Remplacez juste :

Par

Et vous obtenez :

Vous pouvez galement utiliser une liste de slection avec le contrle ListBox :

Notez cependant que le contrle ListBox a deux proprits supplmentaires intressantes : Indique le nombre de lignes affichables dans la liste, si par exemple, vous avez une liste Rows de 50 films et que Rows = 4, seuls 4 films seront visibles a la fois, il faudra utiliser l'ascenseur de la liste pour faire dfiler la liste. Permet de dterminer si l'utilisateur peut slectionner une seule ligne ou plusieurs : Single (une seule) ou Multiple (plusieurs)

SelectionMode

Essayons avec SelectionMode = Multiple

protected void Button1_Click(object sender, EventArgs e) { Literal1.Text = ""; foreach (ListItem item in listeFilms.Items ) { if (item.Selected) Literal1.Text += "Le film : " + item.Text + " est selectionne.
"; } }

Les changements :

La proprit SelectionMode est initialise, vous notez qu'on a supprim les proprits AutoPostBack et la fonction associe a l'vnement selectedIndex. P