Le codage côté client pour ASP.NET comporte deux aspects :
Script côté client : il s'exécute dans le navigateur et accélère à son tour l'exécution de la page. Par exemple, la validation des données côté client peut détecter les données non valides et alerter l'utilisateur en conséquence sans passer par une publication sur le serveur.
Code source client : la page Web ASP.NET constitue ce code source client. Par exemple, le code source HTML d'une page Web ASP.NET contient plusieurs zones cachées et peut injecter automatiquement du code de langage de description Java pour préserver des informations telles que l'état d'affichage ou effectuer d'autres tâches pour garantir le bon fonctionnement de la page Web.
Tous les contrôles du serveur ASP.NET permettent un codage réactif via le langage Java ou le dessin en langage VBS. Certains contrôles serveur ASP.NET utilisent des scripts côté client pour répondre aux besoins des utilisateurs sans les publier sur le serveur. Par exemple, les contrôles de validation des données.
En plus de ces scripts, le contrôle bouton possède une méthode OnClientClick appropriée qui exécute le script client lorsque l'utilisateur clique sur le bouton.
Les contrôles HTML de serveur traditionnels comportent les événements suivants pour exécuter des scripts lorsqu'ils sont lancés :
| événement | propriété |
|---|---|
| onflou | Déclenché lorsque le contrôle perd le focus |
| se concentrer | Déclenché lorsque le contrôle obtient le focus |
| en cliquant | Se déclenche lorsque le contrôle est cliqué |
| en changement | Déclenché lorsque la valeur de contrôle change |
| onkeydown | Se déclenche lorsque l'utilisateur appuie sur un bouton du clavier |
| sur une touche | Lorsque l'utilisateur appuie sur une touche alphanumérique |
| sur la touche | Se déclenche lorsque l'utilisateur relâche la clé |
| au survol de la souris | Déclenché lorsque l'utilisateur déplace le pointeur de la souris sur l'interface de contrôle |
| sur le serveurcliquez | Lorsque l'utilisateur clique sur l'interface de contrôle, démarrez le contrôle d'événement ServerClick |
Nous avons discuté du code source du client ci-dessus. Les pages Web ASP.NET sont généralement écrites dans deux types de fichiers :
Fichier de contenu ou fichier d'approbation (.aspx)
Fichiers code-behind
Les fichiers de contenu contiennent des balises de contrôle HTML ou ASP.NET et du texte pour former la structure de la page. Le fichier code-behind contient les définitions de classification. Au moment de l'exécution, le fichier de contenu est analysé et transmis à une classe de page.
Cette classe de page, ainsi que les définitions de classe dans le fichier de codage et les codages générés par le système, constituent ensemble le codage d'exécution (intégration). Ces codages d'intégration traitent toutes les données de publication, génèrent des réponses et renvoient des actions au client.
Considérez cette page simple :
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Default.aspx.cs" Inherits="clientside._Default" %><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml" > <head runat="server"> <title> Untitled Page </title> </head> <body> <form id="form1" runat="server"> <div> <asp:TextBox ID="TextBox1" runat="server"></asp:TextBox> <asp:Button ID="Button1" runat="server" OnClick="Button1_Click" Text="Click" /> </div> <hr /> <h3> <asp:Label ID="Msg" runat="server" Text=""> </asp:Label> </h3> </form> </body></html>Lorsque cette page est exécutée dans un navigateur, l'option Afficher la source affiche la page HTML et l'envoie au navigateur via le runtime ASP.Net :
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml" > <head> <title> Untitled Page </title> </head> <body> <form name="form1" method="post" action="Default.aspx" id="form1"> <div> <input type="hidden" name="__VIEWSTATE" id="__VIEWSTATE" value="/wEPDwUKMTU5MTA2ODYwOWRk31NudGDgvhhA7joJum9Qn5RxU2M=" /> </div> <div> <input type="hidden" name="__EVENTVALIDATION" id="__EVENTVALIDATION" value="/wEWAwKpjZj0DALs0bLrBgKM54rGBhHsyM61rraxE+KnBTCS8cd1QDJ/"/> </div> <div> <input name="TextBox1" type="text" id="TextBox1" /> <input type="submit" name="Button1" value="Click" id="Button1" /> </div> <hr /> <h3><span id="Msg"></span></h3> </form> </body></html>Si vous parcourez correctement le codage, vous verrez que les deux premières balises <div> contiennent des champs cachés pour stocker l'état d'affichage et les données valides.