Premiers pas avec les Dynamic Forms (formulaires dynamiques)

Objectifs de formation

Une fois cette unité terminée, vous pourrez :

• Expliquer les différences entre les pages d’enregistrement fondées sur des formulaires dynamiques et les pages d’enregistrement standard
• Énumérer les avantages des formulaires dynamiques
• Migrer une page d’enregistrement vers les formulaires dynamiques
• Expliquer comment les pages fondées sur des formulaires dynamiques sont affichées sur les appareils mobiles

Accessibilité

Cette unité nécessite des instructions supplémentaires pour les utilisateurs de lecteurs d’écran. Pour accéder à une version détaillée du lecteur d’écran de cet appareil, cliquez sur le lien ci-dessous.

Ouvrir les instructions du lecteur d’écran Trailhead

Avant de commencer

Cette unité s’appuie sur la page d’enregistrement que vous avez créée dans l’unité précédente. Terminez d’abord l’unité précédente et utilisez la même page d’enregistrement pour réaliser cette unité. 

Que sont les formulaires dynamiques ?

Les formulaires dynamiques amènent le générateur d’application Lightning à un tout autre niveau. Ils vous permettent, en tant qu’administrateur Salesforce, de créer des expériences hautement flexibles et dynamiques que vos utilisateurs adoreront en configurant les champs et sections des détails d’enregistrement dans le générateur d’application Lightning.

Imaginez votre organisation Salesforce d’aujourd’hui. Peut-être dispose-t-elle de plusieurs versions légèrement différentes d’une page pour prendre en charge différents profils ou types d’enregistrement. Peut-être avez-vous également des mises en page avec plus de 100 champs, car différents types d’utilisateurs utilisent différents champs sur le même objet. Plus votre mise en page comporte de champs, plus le composant Record Detail (Détails de l’enregistrement) devient un bloc monolithique de champs que vous ne pouvez pas personnaliser. 

Les formulaires dynamiques divisent le composant Record Detail (Détails de l’enregistrement) de vos pages Lightning en composants de champ et de section individuels que vous pouvez placer n’importe où sur la page, y compris dans des onglets et des sections en accordéon distincts. Vous pouvez utiliser des règles de visibilité pour afficher à vos utilisateurs finaux uniquement les champs qu’ils doivent voir, au moment où ils en ont besoin. 

Les formulaires dynamiques vous offrent les avantages suivants : 

• Mise à niveau instantanée des présentations de page : placez les champs et les sections où vous le souhaitez.
• Présentations dynamiques : utilisez les règles de visibilité pour afficher et masquer les champs et les sections.
• Gestion simplifiée de la présentation :
  • Gérez les champs et les sections de vos pages dans le générateur d’application Lightning sans toucher à l’éditeur de présentation de page.
  • Réduisez le nombre de présentations de page et de types d’enregistrements dont vous avez besoin en définissant des règles de visibilité des composants.
  • Attribuez une page Lightning sans avoir à attribuer également une présentation de page.

Fonctionnement des formulaires dynamiques

Les formulaires dynamiques ajoutent un nouvel onglet au volet des composants : Fields (Champs). L’onglet Fields (Champs) contient le composant Field Section (Section de champ) et une liste de champs. Vous pouvez placer un composant Field Section (Section de champ) n’importe où sur la page, et vous pouvez placer des champs n’importe où dans un composant Field Section (Section de champ).

Vous pouvez commencer à utiliser les formulaires dynamiques de deux manières.

• Créez une page d’enregistrement Lightning. Ensuite, cliquez sur l’onglet Fields (Champs) dans le volet des composants du générateur d’application Lightning et commencez à faire glisser les sections et les champs là où vous le souhaitez sur la page.
• Ouvrez une page d’enregistrement existante et, en quelques clics, migrez les détails de son enregistrement à l’aide de l’assistant de migration Dynamic Forms (Formulaires dynamiques).

Dans cette unité, nous explorons la deuxième option : la migration de pages.

Migration d’une page d’enregistrement vers les formulaires dynamiques

Avec les formulaires dynamiques, vous pouvez réaliser la migration des champs et des sections de vos pages d’enregistrement existantes en tant que composants individuels dans le générateur d’application Lightning. Ensuite, configurez-les comme le reste des composants de la page et ne fournissez aux utilisateurs que les champs et les sections dont ils ont besoin.

La procédure est très simple. La voici.

1. Dans Setup (Configuration), saisissez App Builder (Générateur d’application) dans la zone Quick Find (Recherche rapide), puis sélectionnez App Builder (Générateur d’application Lightning).
2. Ouvrez la nouvelle page d’opportunité que vous avez créée dans la dernière unité.
3. Cliquez sur l’onglet Details (Détails) puis sur les détails de l’enregistrement.
   Cette action sélectionne le composant Record Detail (Détails de l’enregistrement) et affiche ses propriétés dans le volet des propriétés.
4. Dans le volet des propriétés, cliquez sur Upgrade Now (Mettre à niveau maintenant) pour démarrer l’assistant de migration Dynamic Forms (Formulaires dynamiques).
   
5. Parcourez l’assistant, sélectionnez Opportunity Layout (Présentation de l’opportunité), puis cliquez sur Finish (Terminer).
6. Cliquez sur Save (Enregistrer).
   Attendez cependant un instant ! Apparemment, un champ obligatoire est manquant. Si vous enregistrez cette page sans les champs requis et que les champs requis manquants n’ont pas de valeur, les utilisateurs ne peuvent pas sauvegarder les enregistrements qu’ils créent, modifient ou clonent.
   
7. Cliquez sur Cancel (Annuler), et regardons ce qui manque.
8. Cliquez sur l’onglet Fields (Champs) dans la palette des composants.
   Parmi les champs obligatoires universels, Forecast Category (Catégorie de prévision) n’apparaît pas dans l’onglet Details (Détails). Pourquoi n’apparaît-il pas ? Lorsque vous migrez des champs à partir d’une présentation, si les champs obligatoires universels pour l’objet n’étaient pas présents sur la présentation à partir de laquelle vous avez effectué la migration, ils ne sont pas ajoutés automatiquement. (Si vous jetez un coup d’œil à la présentation de la page Opportunity Layout [Présentation de l’opportunité], vous pouvez voir que Forecast Category [Catégorie de prévision] n’y figure pas.)
9. Cliquez sur l’onglet Details (Détails) et faites glisser le champ Forecast Category (Catégorie de prévision) dans la section Opportunity Information (Informations sur l’opportunité).
10. Enregistrez la page de nouveau.

Pourquoi choisir une présentation de page dans l’assistant de mise à niveau alors que l’onglet Fields (Champs) contient tous les champs dont vous avez besoin ? Vous pouvez simplement faire glisser tous ces champs manuellement vers la page. Toutefois, si vous choisissez plutôt une présentation de page, l’assistant de mise à niveau récupère les champs et les sections de cette présentation de page et les ajoute automatiquement à votre page. Quelques clics et le tour est joué !

Voici la page migrée. Chaque section est un composant, tout comme chaque champ à l’intérieur de la section. 

Le composant Record Detail - Mobile (Détail d’enregistrement - Mobile) a été ajouté au bas de la page et le composant Record Detail (Détails de l’enregistrement) d’origine a été supprimé. C’est intentionnel, et nous y reviendrons plus tard.

Personnalisation de la page

Même si vous avez divisé les détails de l’enregistrement en composants de champs individuels, il reste encore un certain nombre de champs sur la page, ce qui peut entraîner des problèmes de performances. Une façon de contourner ce problème consiste à déplacer les champs de priorité inférieure vers des onglets ou des sections en accordéon dont le contenu n’est pas visible lors du chargement de la page.

Optimisons la page. Tout d’abord, supprimez la section vide Other Information (Autres informations).

1. Cliquez sur l’onglet Details (Détails) sur la zone de dessin.
2. Survolez la section Other Information (Autres informations) et cliquez sur  pour la supprimer.

Ensuite, ajoutez un nouvel onglet.

1. Cliquez sur l’onglet Details (Détails) à nouveau.
2. Dans le volet des propriétés des onglets, cliquez sur Add Tab (Ajouter un onglet). Un nouvel élément de l’onglet Details (Détails) apparaît.
3. Cliquez sur le nouvel élément de l’onglet Details (Détails).
4. Dans la liste Tab Label (Étiquette de l’onglet), sélectionnez Custom (Personnalisé). 
   Vous devrez peut-être faire défiler la liste Tab Label (Étiquette de l’onglet) pour trouver Custom (Personnalisé) en haut.
5. Pour Custom Label (Étiquette personnalisée), saisissez More Details (Plus de détails), puis cliquez sur Done (Terminé).
6. Dans le volet des propriétés, faites glisser le nouvel onglet More Details (Plus de détails) au-dessus de l’onglet Activity (Activité).
   

Maintenant, déplacez les sections de champs de Details (Détails) vers More Details (Plus de détails).

1. Sur la zone de dessin, cliquez sur l’onglet Details (Détails) et réduisez la section Opportunity Information (Informations sur l’opportunité) (en réduisant l’espace vertical à faire glisser à l’étape suivante).
2. Dans la section Additional Information (Informations supplémentaires), cliquez sur  et faites glisser la section dans l’onglet More Details (Plus de détails).
3. Faites de même pour la section Description Information (Informations de description) et placez-la sous la section Additional Information (Informations supplémentaires).
4. Dans la section Additional Information (Informations supplémentaires), placez le champ Tracking Number (Numéro de suivi) sous Delivery/Installation Status (Statut de livraison/d’installation).
5. Cliquez sur la section Description Information (Informations de description).
6. Dans le volet des propriétés de la section Description Information (Informations de description), supprimez le mot « Information » (Informations) de l’étiquette de la section. Certes, il s’agit d’un changement assez mineur (et ennuyeux). Cependant, avec les Dynamic Forms (formulaires dynamiques), vous pouvez nommer les sections de champs comme vous le souhaitez. Faites preuve de créativité.

La section Additional Information (Informations supplémentaires) contient cinq champs, mais vos utilisateurs n’ont pas vraiment besoin de voir le champ Main Competitor(s) (Principaux concurrents). C’est là que les Dynamic Forms (formulaires dynamiques) se distinguent vraiment. Vous pouvez personnaliser la section, en ne laissant que les champs pertinents, ici même dans le générateur d’application Lightning, sans utiliser l’éditeur de présentation en page.

Enfin, supprimez les champs inutiles.

1. Dans la section Informations supplémentaires (Additional Information), survolez le champ Main Competitor(s) (Principaux concurrents) et cliquez sur  pour le supprimer.
2. Cliquez sur l’onglet Details (Détails).
3. Développez la section Opportunity Information (Informations sur l’opportunité), puis supprimez le champ Primary Campaign Source (Source de campagne principale).
4. Supprimez le champ Next Step (Étape suivante). 
   Vous voyez comment la colonne s’ajuste automatiquement ?
5. Faites glisser le champ Stage (Étape) au-dessus du champ Close Date (Date de fermeture).
6. Enregistrez la page.

Les modifications que vous avez apportées ici sont un exemple simple de ce que vous pouvez faire avec les Dynamic Forms (formulaires dynamiques). Pour les pages comportant 100 champs ou plus dans le bloc Record Detail (Détails de l’enregistrement) d’origine, ce type d’optimisation peut améliorer considérablement les performances de la page. Les pages avec moins de champs à afficher chargent plus rapidement. De plus, vos utilisateurs n’ont pas besoin de faire défiler autant la page pour accéder aux champs dont ils ont besoin.

Adaptation aux appareils mobiles de votre page d’enregistrement compatible avec les formulaires dynamiques

Dans le cadre du processus de migration de la page, le composant Record Detail (Détails de l’enregistrement) est supprimé de la page. Lorsque vous migrez une page d’enregistrement prenant en charge à la fois les facteurs de forme d’ordinateur de bureau et de téléphone vers les formulaires dynamiques, un composant Record Detail - Mobile (Détails d’enregistrement - Mobile) est ajouté à la page pour vous. 

Le composant Record Detail - Mobile (Détails d’enregistrement - Mobile) affiche le composant Record Detail (Détails de l’enregistrement) d’origine dans un conteneur propre au mobile. Ainsi, sur les pages prenant en charge à la fois les ordinateurs de bureau et les téléphones, vos utilisateurs d’ordinateurs voient les composants Field Section (Section de champ) et vos utilisateurs mobiles voient le composant Record Detail - Mobile (Détails d’enregistrement - Mobile).

Mais attendez. Ce n’est pas vraiment une situation idéale, n’est-ce pas ? Nous voulons que nos utilisateurs mobiles voient le même ensemble de champs organisés que les utilisateurs d’ordinateurs de bureau. Heureusement, il existe une solution pour cela : les Dynamic Forms (formulaires dynamiques) sur appareil mobile. 

Optimisons pour les appareils mobiles les pages d’enregistrement compatibles avec les formulaires dynamiques dans l’organisation.

1. Dans Setup (Configuration), saisissez Mobile dans la zone Quick Find (Recherche rapide), puis sélectionnez Salesforce Mobile App (Application mobile Salesforce).
2. Activez Dynamic Forms on Mobile (Formulaires dynamiques sur appareil mobile). 
   

Avec l’activation de cette option, les pages d’enregistrement qui utilisent des Dynamic Forms (formulaires dynamiques) peuvent désormais afficher les mêmes champs personnalisés à la fois pour vos utilisateurs sur ordinateurs et sur mobiles. Toutes les futures pages d’enregistrement que vous créez et mettez à niveau pour utiliser les formulaires dynamiques après ce stade afficheront automatiquement les champs personnalisés sur mobile et ne contiendront pas le composant Record Detail - Mobile (Détails d’enregistrement - Mobile).

Cependant, étant donné que la nouvelle page d’opportunité a été créée avant que nous ayons activé le bouton, il reste encore une chose à faire avant qu’elle soit adaptée aux appareils mobiles. Si vous activez Dynamic Forms on Mobile (Formulaires dynamiques sur appareil mobile) et que votre page d’enregistrement existante compatible avec les formulaires dynamiques inclut un composant Record Detail - Mobile (Détails d’enregistrement - Mobile), vos utilisateurs continuent de voir uniquement le composant Record Detail - Mobile (Détails d’enregistrement - Mobile) sur leur appareil mobile. Corrigeons ce défaut.

Pour offrir à vos utilisateurs sur mobile la même expérience avec les formulaires dynamiques que les utilisateurs d’ordinateurs, vous devez supprimer le composant Record Detail - Mobile (Détails d’enregistrement - Mobile) des pages existantes. 

1. Dans Setup (Configuration), saisissez App Builder (Générateur d’application) dans la zone Quick Find (Recherche rapide), puis sélectionnez App Builder (Générateur d’application Lightning).
2. À côté de la nouvelle page d’opportunité, cliquez sur Edit (Modifier).
3. Cliquez sur l’onglet Details (Détails) sur la zone de dessin.
4. Survolez le composant Record Detail - Mobile (Détails d’enregistrement - Mobile) et cliquez sur  pour le supprimer.
5. Enregistrez la page.

Nous examinerons la nouvelle page d’opportunité terminée sur ordinateur et mobile dans la prochaine unité.

Maintenant que vous savez ce que les Dynamic Forms (formulaires dynamiques) peuvent faire, essayez-les dans votre propre organisation !

Vous souhaitez connaître les dernières actualités concernant les Dynamic Forms (formulaires dynamiques) ? Rejoignez la communauté Trailblazer sur les formulaires et actions dynamiques, où les équipes produit répondent à vos questions, problèmes et commentaires. Vous pouvez également y consulter la feuille de route des Dynamic Forms Dynamic Forms (formulaires dynamiques) et Actions dynamiques.

Ressources

• Aide Salesforce : Considérations et conseils relatifs aux formulaires dynamiques
• Aide Salesforce : Création et configuration de pages d’enregistrement Lightning Experience
• Aide Salesforce : Champs obligatoires et en lecture seule dans les formulaires dynamiques
• Aide Salesforce : Formulaires dynamiques sur appareil mobile