ASP.NET Razor - Syntaxe du code C# et VB

Razor prend en charge à la fois C# (C sharp) et VB (Visual Basic).

Principales règles de syntaxe C# de Razor

  • Les blocs de code Razor sont contenus dans @{ ... }
  • Les expressions en ligne (variables et fonctions) commencent par @
  • Les instructions de code se terminent par des points-virgules
  • Les variables sont déclarées avec le mot-clé var
  • Les chaînes de caractères sont entourées de guillemets
  • Le code C# est sensible à la casse
  • L'extension des fichiers C# est .cshtml

Exemple C#

<!-- Bloc d'une seule instruction -->
@{ var myMessage = "Hello World"; }

<!-- Expression ou variable en ligne -->
<p>La valeur de myMessage est : @myMessage</p>

<!-- Bloc de plusieurs instructions -->
@{
var greeting = "Welcome to our site!";
var weekDay = DateTime.Now.DayOfWeek;
var greetingMessage = greeting + " Here in Huston it is: " + weekDay;
}
<p>Le message d'accueil est : @greetingMessage</p>

Exécuter l'exemple »

Principales règles de syntaxe Razor VB

  • Les blocs de code Razor sont contenus dans @Code ... End Code
  • Les expressions en ligne (variables et fonctions) commencent par @
  • Les variables sont déclarées avec le mot-clé Dim
  • Les chaînes de caractères sont entourées de guillemets
  • Le code VB n'est pas sensible à la casse
  • L'extension des fichiers VB est .vbhtml

Exemple

<!-- Bloc d'une seule instruction -->
@Code dim myMessage = "Hello World" End Code

<!-- Expression ou variable en ligne -->
<p>La valeur de myMessage est : @myMessage</p>

<!-- Bloc de plusieurs instructions -->
@Code
dim greeting = "Welcome to our site!"
dim weekDay = DateTime.Now.DayOfWeek
dim greetingMessage = greeting & " Ici à Huston, il est : " & weekDay
Fin du code

<p>Le message d'accueil est : @greetingMessage</p>

Exécuter l'exemple »

Comment cela fonctionne-t-il ?

Razor est une syntaxe de programmation simple pour intégrer du code serveur dans des pages web.

La syntaxe Razor est basée sur le framework ASP.NET, la partie du framework Microsoft.NET spécialement conçue pour créer des applications Web.

La syntaxe Razor prend en charge toutes les fonctionnalités d'ASP.NET, mais utilise une syntaxe simplifiée qui est plus facile à apprendre pour les débutants et plus efficace pour les experts.

Les pages web Razor peuvent être décrites comme des pages HTML avec les deux types de contenu suivants : contenu HTML et code Razor.

Lorsque le serveur lit la page, il exécute d'abord le code Razor, puis envoie la page HTML au navigateur. Le code exécuté sur le serveur peut effectuer des tâches qui ne peuvent pas être réalisées dans le navigateur, comme l'accès aux bases de données du serveur. Le code serveur peut créer du contenu HTML dynamique et l'envoyer ensuite au navigateur. Du point de vue du navigateur, le HTML généré par le code serveur n'est pas différent d'un contenu HTML statique.

Les pages web ASP.NET avec la syntaxe Razor ont des extensions de fichier spéciales cshtml (Razor C#) ou vbhtml (Razor VB).

Utilisation des objets

La programmation côté serveur implique souvent des objets.

L'objet "Date" est un objet ASP.NET intégré typique, mais les objets peuvent aussi être personnalisés : une page web, une zone de texte, un fichier, un enregistrement de base de données, etc.

Les objets ont des méthodes pour l'exécution. Un enregistrement de base de données peut avoir une méthode "Save", un objet image peut avoir une méthode "Rotate", un objet e-mail peut avoir une méthode "Send", etc.
Les objets ont également des propriétés qui décrivent leurs caractéristiques. Un enregistrement de base de données peut avoir des propriétés FirstName et LastName.

L'objet Date d'ASP.NET possède une propriété Now (écrite Date.Now), et la propriété Now possède une propriété Day (écrite Date.Now.Day). L'exemple ci-dessous montre comment accéder à certaines propriétés de l'objet Date :

Exemple

<table border="1">
<tr>
<th width="100px">Nom</th>
<td width="100px">Valeur</td>
</tr>
<tr>
<td>Jour</td><td>@DateTime.Now.Day</td>
</tr>
<tr>
<td>Heure</td><td>@DateTime.Now.Hour</td>
</tr>
<tr>
<td>Minute</td><td>@DateTime.Now.Minute</td>
</tr>
<tr>
<td>Seconde</td><td>@DateTime.Now.Second</td>
</tr>
</td>
</table>

Exécuter l'exemple »

Conditions If et Else

Une caractéristique importante des pages web dynamiques est que vous pouvez décider quoi faire en fonction de conditions.

Une manière courante de faire cela consiste à utiliser l'instruction if ... else :

Exemple

@{
var txt = "";
if(DateTime.Now.Hour > 12)
{txt = "Bonsoir";}
else
{txt = "Bonjour";}
}
 <html>
<body>
<p>Le message est @txt</p>
</body>
</html>

Exécuter l'exemple »

Lecture de la saisie utilisateur

Une autre fonctionnalité importante des pages web dynamiques est que vous pouvez lire la saisie de l'utilisateur.

La saisie est lue via la fonctionnalité Request[], et les données de saisie transmises passent par la vérification conditionnelle IsPost :

Exemple

@{
var totalMessage = "";
if(IsPost)
{
var num1 = Request["text1"];
var num2 = Request["text2"];
var total = num1.AsInt() + num2.AsInt();
totalMessage = "Total = " + total;
}
}
<html>
<body style="background-color: beige; font-family: Verdana, Arial;">
<form action="" method="post">
<p><label for="text1">Premier nombre :</label><br>
<input type="text" name="text1" /></p>
<p><label for="text2">Deuxième nombre :</label><br>
<input type="text" name="text2" /></p>
<p><input type="submit" value=" Ajouter " /></p>
</form>
<p>@totalMessage</p>
</body>
</html>

Exécuter l'exemple »

Autres extensions