Visual Studio 2010 ASP.NET MVC, 2Fonctions annexes avec modèle

Un formulaire d’édition type contient plusieurs champs, chacun d’eux avec un schéma similaire à ce qui suit :

‹div class= »editor-label »>
‹%= Html.LabelFor(m => m.TestDatePicker) %>
‹/div>
‹div class= »editor-field »>
‹%= Html.TextBoxFor(m => m.TestDate)%>
‹%= Html.ValidationMessageFor(m => m.TestDatePicker) %>
‹/div>

Afin d’augmenter la productivité des développeurs, Visual Studio 2010 ASP.NET MVC 2 a introduit les fonctions annexes (helper) fortement typées et avec modèle, dont les noms se terminent généralement par « For », et qui utilisent des expressions lambda afin de fournir un contrôle au moment de la compilation et la fonction IntelliSense. Ces fonctions annexes utilisent largement les attributs DataAnnotation placés sur la classe et les champs de Modèle, afin d’assurer le rendu approprié des libellés et noms de champs, et d’effectuer des contrôles de validation.

Les fonctions annexes avec modèle (Templated helper) permettent d’assurer le rendu de tous les champs pour un formulaire d’édition ou d’affichage concernant un objet entier au moyen d’une seule méthode d’extension :

‹%= Html.EditorForModel() %>

ASP.NET MVC 2 fournit un ensemble de modèles par défaut servant au rendu de chaque champ dans un objet de Modèle, sur la base de son type de données et de ses attributs DataAnnotation. Pour la majeure partie, ces modèles assurent un rendu raisonnable du HTML, mais il arrive parfois que vous souhaitiez personnaliser le rendu pour un type de données particulier, toutes les classes de données, voire une classe de données spécifique. ASP.NET MVC 2 fournit un point d’extension qui permet aux développeurs de remplacer ses modèles par défaut. Il est possible d’exploiter cette fonctionnalité afin d’ajouter un DatePicker jQuery à tous les champs DateTime.

Afin de créer un modèle d’éditeur personnalisé pour le type DateTime, commencez par créer le dossier Views/Shared/EditorTemplates dans votre projet ASP.NET MVC et intégrez une Vue partielle intitulée DateTime.ascx. Ajoutez le contenu suivant à la Vue partielle :

‹%@ Control Language= »C# » Inherits= »System.Web.Mvc.<br />ViewUserControl » %>
‹% string formatString = ViewData.ModelMetadata.DisplayFormat-
String ?? « {0:d} »; %>
‹% string displayString = String.Format(formatString, this.
Model); %>
‹%=Html.TextBox(«  », displayString, new { @class = « myDatePick-
erClass » })%>

Chaque fois qu’une méthode de fonction annexe avec modèle telle que Html.EditorFor-Model() est appelée, ASP.NET MVC 2 utilise ce modèle pour le rendu de tous les champs DateTime dans le Modèle. Le modèle personnalisé dans mon exemple définit une valeur formatée initiale pour le TextBox soit en employant un format spécifié sur le champ du Modèle au moyen d’un attribut DisplayFormat DataAnnotation, soit en utilisant un format d’affichage par défaut.

Bien que ASP.NET MVC 2 n’utilise pas de contrôles serveur enrichis comme le modèle Web Forms, des bibliothèques open source telles que jQuery UI peuvent fournir des plug-ins qui offrent les mêmes fonctionnalités enrichies dans le navigateur avec seulement quelques lignes de code.