Exemple : Validation d'un coach dans un service utilisateur côté client

Cette exemple explique comment utiliser les propriétés de modification de données d'un coach dans un service utilisateur côté client afin de valider les données du coach sans quitter celui-ci.

Pourquoi et quand exécuter cette tâche

L'exemple suivant illustre la manière de valider les données saisies par un utilisateur dans le coach de sorte qu'un message d'erreur s'affiche dans le coach lorsque les données ne sont pas valides. Il explique également comment empêcher l'utilisateur de passer à l'étape suivante lorsque les données ne sont pas valides.

L'exemple inclut un coach Prompt for Start and End Dates (invite à la saisie des dates de début et de fin), lequel comporte une zone Date de début, une zone Date de fin, ainsi qu'un bouton OK. La date de début est antérieure à la date de fin. Pour valider les données du coach, vous spécifiez un code JavaScript côté client dans le coach pour effectuer la validation.

Remarque : Cet exemple montre comment valider un coach dans un service utilisateur côté client à l'aide de IBM® Process Designer. Pour plus d'informations sur la validation d'un coach dans un service utilisateur d'héritage, voir Exemple : Validation de données Coach dans un service utilisateur d'héritage dans la version bureau de Process Designer (obsolète).

Procédure

Créez le service utilisateur côté client qui contient le coach à valider. Voir Génération d'un service utilisateur côté client.
Sur l'onglet Variables du service utilisateur, créez deux variables privées, startDate et endDate, puis définissez le type de chaque variable sur Date.
Dans le diagramme du service utilisateur côté client, renommez le Coach en Demande de dates de début et de fin.
Sur l'onglet Coaches, sous la section Variables de la palette, faites glisser les paramètres startDate et endDate sur le coach. Laissez le bouton OK par défaut inchangé.
Dans le coach, sélectionnez le paramètre Date de début et vérifiez qu'il est lié à la variable startDate dans la section Comportement de l'onglet Général.
Répétez l'étape 5 pour le paramètre Date de fin afin de vérifier qu'il est correctement lié à la variable endDate, puis sauvegardez la configuration du coach.
Dans la vue de diagramme du coach, cliquez sur l'onglet Modification de données, puis dans les propriétés Script, entrez la syntaxe JavaScript suivante :
```
if (tw.local.startDate.getTime() > tw.local.endDate.getTime())
	tw.system.coachValidation.addValidationError("tw.local.startDate", "The start date must precede the end date. Set the start date before the end date, and try again.");
```
Dans l'objet coachValidation, la première chaîne contient le chemin de variable complet permettant d'accéder aux éléments dont les données doivent être validées. La deuxième chaîne représente le message destiné à l'utilisateur, qui indique le problème concernant les données et comment le résoudre.
Remarque :
- Si l'élément de données à valider n'est pas lié à une vue Coach, l'éventuelle erreur de validation ne pourra s'afficher nulle part.
- Si une vue Coach à valider contient du texte enrichi, le script de validation doit supprimer la mise en forme avant de valider le contenu.
- Si vous validez une liste et que vous souhaitez que l'erreur fasse référence à la liste complète, le paramètre variableName doit inclure [] comme suffixe. Ceci correspond à la liaison de la vue Coach où [] indique que l'objet est une liste. Par exemple, si la vue Coach est liée à tw.local.var3[], qui représente une liste, vous avez besoin d'un code similaire à ce qui suit :
```
tw.system.coachValidation.addValidationError("tw.local.var3[]", "Var3 has validation error");
```
Facultatif : Pour empêcher l'utilisateur de passer à l'étape suivante lorsque des données ne sont pas valides, exécutez la procédure cit-après.
1. Sur l'onglet Variables du service utilisateur, ajoutez une autre variable privée nommée readyToSubmit, puis définissez-en le type sur Boolean.
2. Dans les propriétés Script du coach sélectionné, ajoutez le code JavaScript suivant au script existant :
```
tw.local.readyToSubmit = tw.system.coachValidation.validationErrors.length==0;
```
3. Sur l'onglet Coaches, configurez le bouton OK pour qu'il soit en lecture seule quand les données ne sont pas prêtes, comme illustré ci-après.
Cliquez sur Sauvegarder ou sur Terminer la modification.
Cliquez sur Exécuter pour exécuter le service utilisateur.
Dans le navigateur qui affiche le coach, testez la validation en procédant comme suit :
1. Définissez le paramètre Date de fin sur une date antérieure à la date de début. Cliquez sur OK. Le navigateur met en évidence la zone Date de début et affiche une icône d'avertissement. Si vous passez le curseur sur cette icône, le message indiquant que la date de début doit être antérieure à la date de fin apparaît.
2. Définissez le paramètre Date de fin sur une date postérieure à la date de début. Cliquez sur OK. Le service utilisateur se termine correctement, car les deux dates sont valides.