Article
09/01/2015

Cet article a fait l'objet d'une traduction automatique.

Point sur les données

Validation des données avec Silverlight 3 et le DataForm

JOHN PAPA

Création d'applications Silverlight robustes qui modifier et valident des données a beaucoup plus facile avec l'introduction du contrôle DataForm dans Silverlight 3. Le contrôle DataForm contient diverses fonctions permettant de créer des formulaires qui permettent l'ajout, modification, suppression et parcourir les jeux de données. Les avantages de plus de la DataForm sont ses options de souplesse et de personnalisation.

Dans colonne ’s ce mois-ci, je montrerai comment fonctionne le contrôle DataForm et comment il peut être personnalisé et je le montrer dans action. Je commencer par présenter une application exemple qui utilise plusieurs fonctionnalités pour lier, naviguer, modifier et valider des données à l'aide la DataForm. Puis je guider comment l'application exemple fonctionne, lors de souligner les conditions de base pour utiliser le contrôle et je vous recommande de personnalisations. Bien que les DataAnnotations ne sont pas requis par le DataForm, ils peuvent influencer l'apparence, les aspects de validation et le comportement de la DataForm. Les DataAnnotations peuvent également indiquer une méthode de validation personnalisée à appeler pour une propriété ou une entité entière. Je Vais vous montrer comment implémenter les DataAnnotations sur une entité et comment écrire vos propres méthodes PAPAvalidation personnalisés. Tout le code de cet article peut être téléchargé à partir du MSDN Code Gallery (msdn.microsoft.com/mag200910DataPoints).

Quel ’s le Endgame ?

Avant de plonger dans le code, let’s examinons l'exemple d'application qui illustre la navigation, validation et fonctionnalités d'édition de la DataForm. La figure 1 présente un contrôle DataGrid affichant une liste des employés et un DataForm où chaque enregistrement d'employé peut être modifié. Les employés dans le contrôle DataGrid peuvent navigués, qui est l'employé actuellement sélectionné. Le DataForm est lié au même jeu d'employés et reçoit cet employé.

Barre d'outils

DataForm illustré à la figure 1 a été placé en mode édition par conséquent, l'utilisateur peut rendre modifications et l'enregistrer ou annuler les. La barre d'outils supérieure droite de la DataForm affiche des icônes pour modification (crayon), ajouter un nouvel enregistrement (signe plus) et suppression d'un enregistrement (le signe moins). Ces boutons peuvent être un style et désactivées selon vos besoins. L'état des boutons est déterminé par les interfaces implémentées par l'entité, lors de leur visibilité peut être personnalisée en définissant des propriétés sur le DataForm.

Étiquettes

Les légendes de chaque contrôle TextBox dans le DataForm peuvent être placés à côté ou au-dessus du contrôle. Le contenu des étiquettes peut être utilisant l'attribut Display DataAnnotations pilotées par les métadonnées. Les attributs DataAnnotations sont placés dans les propriétés de l'entité, dans ce cas l'entité employé, où ils aident les informations DataForm, telles que le texte à afficher dans les étiquettes de champ d'alimentation.

DescriptionViewer

Lorsque le DataForm est en mode édition (comme dans de la figure 1), l'utilisateur peut pointer sur l'icône à côté de la légende située en regard de chaque contrôle TextBox pour afficher une info-bulle qui fournit des informations plus sur les éléments à entrer dans le champ. Cette fonctionnalité est implémentée par la DataForm lorsque vous placez un contrôle DescriptionViewer située en regard du contrôle TextBox lié. Le texte affiché dans l'info-bulle de la DescriptionViewer est également transmis à partir de l'attribut DataAnnotations afficher.

Figure 1 validation et modification avec la DataForm

Annuler et de validation

Le bouton Annuler au bas de la DataForm est activé en mode édition. Le bouton Enregistrer est activé en mode édition et un utilisateur modifie une valeur dans la DataForm. Le texte et les styles de ces boutons peuvent être personnalisés.

La figure 2 de la zone DataForm

Notification de validation

NotificationThe DataForm dans l'exemple est affiché dans l'état d'édition dans lequel l'utilisateur a tapé une adresse de messagerie non valide et le numéro de téléphone. Notez que les légendes de champ pour les champs invalidées sont en rouge et les zones de texte sont mettant en rouge avec un indicateur rouge dans le coin supérieur droit. Lorsqu'un utilisateur place le curseur dans un contrôle non valide, une info-bulle s'affiche avec un message décrivant ce qui doit être fait pour corriger le problème. La figure 1 affiche également une liste des erreurs de validation en bas de l'écran. Tous les ces fonctionnalités prises en charge par le DataForm et DataAnnotations et que vous peuvent utiliser des styles personnalisés pour donner une apparence personnalisée. Les règles de validation sont insérées à partir de plusieurs DataAnnotations pour indiquer des règles en conserve, telles que les champs obligatoires ou des règles personnalisées.

Conception de la DataForm

DataForm, trouvée dans la Shared Computer Shared Computer Toolkit Silverlight, peut être ajouté à un projet une fois l'assembly que System.Windows.Controls.Data.DataForm.Shared Computer Toolkit.dll a été référencé. Le DataForm peut être créé avec très peu d'installation. Une fois faire glisser vers l'aire de conception dans Blend ou créées dans XAML, en définissant simplement l'ItemsSource de la DataForm à une collection d'entités, la DataForm génère automatiquement les champs à afficher, puis activez fonctionnalités d'édition appropriées. Le XAML suivant générera DataForm illustré à la de la figure 2:

<dataFormToolkit:DataForm x:Name="dataForm" ItemsSource="{Binding Mode=OneWay}" />

Remarque : Le mode de liaison est défini sur OneWay dans l'exemple précédent uniquement à des fins d'explicite. Il n'est pas nécessaire. Cependant, je trouve utile de clarté et de prise en charge définir explicitement le mode de liaison.

Paramètres supplémentaires peuvent être raccordés à DataForm pour affiner sa fonctionnalité. Paramètres communs incluent ceux qui sont affichés dans de la figure 3.

La figure 3 DataForm personnalisation courantes

Souvent, il est intéressant de style fonctionnalités visuelles ’s DataForm pour les coordonner l'aspect visuel de votre application. Plusieurs aspects de la DataForm peuvent être un style l'utilisation des ressources dans le document, app.xaml ou un dictionnaire de ressources. Il existe plusieurs styles qui peuvent être définies, comme dans de la figure 4 dans la capture d'écran partielle dans Expression Blend. Notez que CancelButtonStyle et le CommitButtonStyle défini à la fois à une valeur. C'est ce qui donne les boutons de l'apparence bleu comme indiqué dans le bas de l'écran dans figure 1. DataForm lui-même peut être un style en définissant la propriété style. Des aspects individuels de DataForm, comme le DataField ou ValidationSummary, peuvent également être le style.

En définissant certaines de ces propriétés plus courantes de la DataForm, ainsi que certains styles de base, nous observer l'apparence et une fonctionnalité dans de la figure 1. Les paramètres de l'application exemple inclus dans cet article sont indiqués dans les de la figure 5. Remarquez que AutoEdit et AutoCommit sont les deux définies sur false, nécessitant ainsi que le DataForm être explicitement placés en mode édition par l'utilisateur en cliquant sur le bouton Modifier dans la barre d'outils et que l'utilisateur cliquez sur le bouton Enregistrer pour valider les modifications.

La figure 4 styles le DataForm

Le bouton de navigation est omis de la propriété CommandButtonsVisibility, ce qui signifie que la barre d'outils n'affichera pas les options de navigation. Si nous incluez cette option en ajoutant le mot clé navigation à le CommandButtonsVisibility ou en modifiant le paramètre le mot clé ALL, la DataForm serait afficher également les boutons de barre d'outils de navigation. Étant donné que les boutons validation et Annuler sont inclus dans la propriété CommandButtonsVisibility, ils seront visibles. Pendant que le DataForm n'a pas encore été modification, il sera désactivé le bouton Annuler comme dans de la figure 6. Les boutons de navigation permettent de l'utilisateur de se déplacer dans la collection d'enregistrements. Toutefois, dans cette application exemple, les utilisateurs peuvent également accéder à l'aide du contrôle DataGrid lié aux données, car il est également lié au même jeu de données que le DataForm. Par conséquent, je désactivé les boutons de navigation dans la barre d'outils uniquement comme un choix de conception, car la fonctionnalité de navigation peut déjà être obtenue avec le contrôle DataGrid.

DataAnnotations

De nombreuses fonctionnalités de la DataForm est piloté par les attributs DataAnnotations placés sur les données entité liés à la DataForm. Les DataAnnotations sont disponibles une fois que vous référencez l'assembly System.ComponentModel.DataAnnotations.dll. Le DataForm examine les attributs et les applique en conséquence. La figure 7 présente plusieurs des attributs DataAnnotations peuvent décorer les propriétés d'une entité et explique leur effet.

La figure 5 Personnalisation le DataForm

<dataFormToolkit:DataForm x:Name="dataForm"
                 ItemsSource="{Binding Mode=OneWay}"
                 BorderThickness="0"
                 FontFamily="Trebuchet MS" FontSize="13.333"
                 CommitButtonContent="Save"
                 CancelButtonContent="Cancel"
                 Header="Employee Details"
                 AutoEdit="False"
                 AutoCommit="False"
                 AutoGenerateFields="True"
                 CommandButtonsVisibility="Edit, Add, Delete, Commit, Cancel"
                 CommitButtonStyle="{StaticResource ButtonStyle}"
                 CancelButtonStyle="{StaticResource ButtonStyle}"
                 DescriptionViewerPosition="BesideLabel"
                 LabelPosition="Left" />

L'attribut affichage flux ’s DataForm Label et DescriptionViewer avec les paramètres Name et description, respectivement. Si cet argument est omis, la DataForm génère automatiquement ces valeurs pour les contrôles utilisant le nom de la propriété. Notez que dans 8 que propriété FirstName ’s entité employé est décorée avec attributs DataAnnotations 3. L'attribut d'affichage indique que l'étiquette doit afficher le texte “ nom respectez et le DescriptionViewer doit afficher une info-bulle de “ ’s employé prénom respectez.

L'attribut obligatoire indique qu'une valeur doit être entrée pour la propriété Prénom. L'attribut requis, comme tous les attributs de validation, accepte un paramètre ErrorMessage. Le paramètre ErrorMessage indique le message sera affiché dans une info-bulle pour le contrôle invalidé et dans le contrôle ValidationSummary le DataForm. L'attribut StringLength pour la propriété Prénom est défini pour indiquer que le champ ne peut pas dépasser 40 caractères et si tel est le cas, un message d'erreur sera affichée.

Le code dans de la figure 8 illustre que lorsqu'une valeur est définie sur la propriété, la méthode de validation est appelée. Valider est une méthode créé avec la classe de base ModelBase j'ai utilisé pour toutes les entités dans cet exemple. Cette méthode valide la propriété en vérifiant sur tous ses attributs DataAnnotations. Si un d'eux échoue, il lève une exception, n'affecte pas la propriété la valeur non valide et dirige le DataForm pour avertir l'utilisateur. Figure 1 shows the results of emptying the FirstName field, since it is required.

Valider méthode la classe ’s ModelBase est appelée dans chaque accesseur Set de propriété pour chaque propriété peut être validée lorsqu'elle est définie. La méthode accepte la nouvelle valeur et le nom de la propriété en cours de validation. Ces paramètres sont passés à son tour à ValidateProperty méthode la classe ’s validateur, qui effectue la validation réelle sur la valeur de propriété :

protected void Validate(object value,
string propertyName) {
Validator.ValidateProperty(value,
new ValidationContext(this, null, null) {
MemberName = propertyName });
}

Le validateur est une classe statique qui permet d'effectuer une validation en utilisant plusieurs techniques différentes :

La méthode ValidateProperty vérifie les valeurs d'une propriété unique et lève DataAnnotations.ValidationException si la valeur n'est pas valide.
La méthode ValidateObject vérifie toutes les propriétés de l'entité entière et lève DataAnnotations.ValidationException si n'importe quelle valeur n'est pas valide.
La méthode TryValidateProperty effectue les mêmes vérifications de validation comme ValidateProperty, mais elle retourne une valeur Boolean au lieu de lever une exception.
La méthode TryValidateObject effectue les mêmes vérifications de validation comme ValidateObject, mais elle retourne une valeur Boolean au lieu de lever une exception.
La méthode ValidateValue accepte une valeur et une collection d'attributs de validation. Si la valeur échoue un des attributs, une ValidationException est levée.
La méthode TryValidateValue effectue les mêmes vérifications de validation comme ValidateValue, sauf qu'elle retourne une valeur Boolean au lieu de lever une exception.

La figure 7 Common DataAnnotations

La figure 8 avec DataAnnotations propriétés Prénom

private string firstName;
[Required(ErrorMessage = "Required field")]
[StringLength(40, ErrorMessage = "Cannot exceed 40")]
[Display(Name = "First Name", Description = "Employee's first name")]
public string FirstName
{
get { return firstName; }
set
{
if (firstName == value) return;
var propertyName = "FirstName";
Validate(value, propertyName);
firstName = value;
FirePropertyChanged(propertyName);
}
}

J'ai créé également une méthode dans la classe ModelBase nommée IsValid, qui appelle la méthode TryValidateObject, comme illustré ci-dessous. Cette méthode peut être appelée sur l'entité à tout moment pour déterminer si elle est dans un état valide :

public bool IsValid() {
return Validator.TryValidateObject(this,
new ValidationContext(this, null, null),
this.validationResults, true);
}

La figure 9 de la validation de propriété personnalisée

public static class EmployeeValidator
{
public static ValidationResult ValidateAge(int age)
{
if (age > 150)
return new ValidationResult("Employee's age must be under 150.");
else if (age <= 0)
return new ValidationResult(
"Employee's age must be greater than 0.");
else
return ValidationResult.Success;
}
}

Validation personnalisée

Lorsqu'un attribut en conserve à partir de l'ensemble de DataAnnotations ne suffit pas, vous pouvez créer une méthode de validation personnalisée et l'appliquer à un objet entier ou une valeur de la propriété. La méthode de validation doit être statique et renvoyer un objet ValidationResult. L'objet ValidationResult est le véhicule qui contient le message qui sera lié à la DataForm. La figure 9 présente la méthode de validation personnalisée ValidateAge, qui vérifie que la valeur est comprise entre 0 et 150. Il s'agit d'un exemple simple et un attribut Range pourrait ont été utilisé. Toutefois, la création d'une méthode spécifique permet à être réutilisé par plusieurs entités pour la validation.

Pouvez également créer des méthodes validation personnalisée pour valider un objet entier. La méthode ValidateEmployee accepte l'entité entière employé et examine plusieurs propriétés pour déterminer si l'entité est dans un état valide. Ceci est très utile pour appliquer la validation au niveau entité, comme indiqué ci-dessous :

public static ValidationResult ValidateEmployee(Employee emp) {
string[] memberNames = new string[] { "Age", "AnnualSalary" };
if (emp.Age >= 50 && emp.AnnualSalary < 50000)
return new ValidationResult(
"Employee is over 50 and must make more than $50,000.",
memberNames);
else
return ValidationResult.Success;
}

Le contrôle résumé de validation est affiché par le DataForm lorsque plusieurs ValidationExceptions sont levées (voir de la figure 10). Le nom du champ est en surbrillance en gras lettering pendant que le message de validation est affiché en regard. Le style de la ValidationSummary peut également être personnalisé pour utiliser une ressource, si vous le souhaitez.

La figure 10 Résumé de validation

Influencers

Le DataForm prend sa indication DataAnnotations ainsi que des interfaces qui implémente sa source de données liée. Par exemple, l'entité employé implémente l'interface IEditableObject. Cette interface force l'implémentation des méthodes BeginEdit et CancelEdit EndEdit qui sont appelées par la DataForm au moment approprié pendant que le DataForm est en cours de modification. Dans l'exemple d'application, j'ai utilisé ces méthodes pour implémenter un comportement d'annulation afin que l'utilisateur sur le bouton Annuler et rétablir les valeurs entité d'origine.

Ce comportement est obtenu en créant une instance de l'entité dans la méthode BeginEdit (nommé cache) et copie les valeurs d'origine à partir de l'entité. La méthode EndEdit efface l'objet cache pendant que la méthode CancelEdit copie tout formulaire de valeurs de l'entité de cache sur l'entité d'origine, ainsi restaurer son état d'origine.

Lorsque le DataForm voit que la collection qu'il est lié est un CollectionViewSource, il prendra en charge d'édition, tri, filtrage et suivi de l'enregistrement actif (appelé aussi devise). La fonctionnalité devise est importante, car elle garantit également que le DataForm ne permet pas à un utilisateur quitter un état non valide entité sans résoudre et valider ou annuler les modifications. Liaison du DataForm à un PagedCollectionView fournit également ces mêmes fonctionnalités et propose également suppression d'un élément, l'ajout d'un élément et grouper des éléments. Liaison à une ObservableCollection désactivera certaines de ces fonctionnalités, comme en soi ObservableCollection n'implémente pas les interfaces qui recherche la DataForm.

Si vos entités sont déjà inclues dans une ObservableCollection, vous pouvez créer un PagedCollectionView en passant l'instance ObservableCollection dans la collection via son constructeur, comme indiqué ci-dessous :

var employees = new DataService().GetPeople();
PagedCollectionView view = new PagedCollectionView(employees);
this.DataContext = view;

Vous pouvez également créer un CollectionViewSource en passant ObservableCollection d'employés dans l'initialiseur de collection ’s CollectionViewSource et en définissant la propriété source, comme indiqué ci-dessous :

var employees = new DataService().GetPeople();
CollectionViewSource view = new CollectionViewSource
{Source = employees};
this.DataContext = view;

Conclusion

Le DataForm ajoute un grand nombre de valeur pour les applications et au processus normalement beaucoup de code et monotonous de navigation, modification et affichage des données. Ses fonctionnalités sont personnalisables pour répondre à vos besoins, et peut être style visuellement à fusionner avec conception ’s votre application.

John Papa*(johnpapa.net de) est un consultant senior et un fan de baseball qui passe nuits d'été supporter les Yankees avec sa famille. Papa, MVP Silverlight, Silverlight Insider et INETA, a écrit plusieurs livres, notamment ses dernières “ basé sur des données des services avec Silverlight 2 respectez (O’Reilly, 2009). Il participe souvent à des conférences telles que VSLive!, DevConnections et MIX.*