--- sourceDocument: Yokohama Créer ou modifier des applications sourceDocumentLink: https://servicenow-prod.fluidtopics.net/r/fr-FR/yokohama/application-development Release : - yokohama ft:locale : - fr-FR ft:publication_title : - Yokohama Créer ou modifier des applications ft:clusterId : - cadev bundleId : - cadev workflow : - Creator --- Lier un événement à un composant ================================ Lier un événement à un composant {#ariaid-title1} ================================================= * Rversion finale: Yokohama * * Mis à jour 30 janv. 2025 * * ![](https://www.servicenow.com/docs/portal-asset/ico-clock) 3 minutes de lecture Liez des éléments de données à l'intérieur Générateur d'IU afin de pouvoir ajouter des actions d'événement à vos composants. Avant de commencer ------------------ Rôle requis : ui_builder_admin Pourquoi et quand exécuter cette tâche -------------------------------------- Chaque composant a des événements spécifiques auxquels il est lié. Par exemple, un composant de bouton comporte uniquement un événement sur lequel l'utilisateur a cliqué, tandis que d'autres composants peuvent être associés à plusieurs événements. Certains composants ne sont pas dotés d'une action d'événement qui leur est appliquée. Un exemple est le composant d'en-tête. De nombreux composants nécessitent que vous mappiez un événement à votre composant pour qu'il effectue une action, telle que le chargement de données. Pour ajouter des actions aux composants, aux pages et aux ressources de données sur votre page, vous pouvez ajouter un gestionnaire d'événements. Un composant de bouton que vous ajoutez à une page est statique. En liant une action d'événement au bouton, vous pouvez la lier à une page Web. Procédure --------- 1. Accédez à la ToutCadre de travail Now ExperienceGénérateur d'IU. 2. Ouvrez une expérience pour y travailler ou créez une expérience en sélectionnant CréerExpérience. Pour plus d'informations, consultez [Configurer la façon dont les utilisateurs interagissent avec vos applications dans Générateur d'IU](https://servicenow-prod.fluidtopics.net/Y1bOUW4pQdHutnAVEjdwrA "Découvrez ce qu’est une expérience dans Générateur d'IU. Comprendre le contenu d’une expérience."). 3. Créez ou ouvrez une page. Pour plus d'informations sur la création d'une page dans Générateur d'IU, consultez [Créer une page dans le générateur d'IU](https://servicenow-prod.fluidtopics.net/7FlPZg9EshuX4KGkHUH3Ew "Créez une page Générateur d'IU pour un portail, un espace de travail ou une application personnalisée afin de créer une expérience Web pour vos utilisateurs."). 4. Ajoutez un composant qui possède des événements auxquels il peut se lier à votre page, tel qu'un bouton. Pour plus d'informations sur l'ajout de composants à une page, reportez-vous à la section [Ajouter et configurer des composants](https://servicenow-prod.fluidtopics.net/n3~Oe6m5E9q11DW86sXzOA#add-components "Découvrez comment ajouter des composants à votre page dans Générateur d'IU. Une page est créée en ajoutant des composants."). 5. Pour ajouter un gestionnaire d'événements à votre composant, sélectionnez l'onglet Événements . Pour plus d'informations sur l'ajout de gestionnaires d'événements à votre composant, reportez-vous à la section [Gérer les actions dans les pages du générateur d'IU](https://servicenow-prod.fluidtopics.net/JPlu5OHPkRgfmeiDM~ttKw "Découvrez comment utiliser des événements pour ajouter des actions aux composants, aux pages, aux ressources de données et aux actions déclaratives dans Générateur d'IU."). 1. Pour démarrer le processus de configuration d'un gestionnaire d'événements pour votre composant, cliquez sur Ajouter un mappage d'événements. 2. Sélectionnez le mappage d'événements que vous souhaitez configurer dans la liste. 3. Sélectionnez Continuer. 4. Dans la section d'aperçu du gestionnaire d'événements, sélectionnez un gestionnaire d'événements à lier à votre composant. 5. Sélectionnez Continuer. 6. Configurez la charge utile de l'événement. Vous configurez chaque gestionnaire d'événements différemment, en fonction de l'action de l'événement. Par exemple, si vous ajoutez un gestionnaire d'événements pour un composant de bouton, vous pouvez choisir ce que cette action de bouton effectue. 7. Sélectionnez Ajouter. {#bind-event-component__substeps_v3n_xw3_znb} 6. **Facultatif :** Si vous souhaitez qu'un modal s'affiche pour votre événement, ajoutez-le à la page avant de lier votre événement au composant. Un modal est une fenêtre contextuelle de confirmation qui s'affiche lorsque vous cliquez sur le composant. Par exemple, si vous ajoutez un composant de bouton qui supprime un enregistrement, vous ajoutez un modal pour demander à l'utilisateur de confirmer que l'utilisateur souhaite supprimer l'enregistrement. Pour plus d'informations, consultez [Ajouter un modal au composant](https://servicenow-prod.fluidtopics.net/DOZ21S1bm6HitsMmON5~Ng "Découvrez comment ajouter un modal dans Générateur d'IU. Un modal est une fenêtre qui s’affiche lorsque vous cliquez sur un composant. Par exemple, un modal peut s’afficher lorsque l’utilisateur clique sur un composant de bouton Supprimer, invitant l’utilisateur à confirmer la suppression d’un enregistrement."). 1. Sélectionnez l'icône + dans l'arborescence de contenu en regard de Modals. 2. Choisissez un type de modal tel que Confirmer. 3. Configurez le modal. Vous pouvez modifier le texte dans la fenêtre modale, les noms des boutons dans la fenêtre modale et la taille de l'écran modal. Vous pouvez également définir des actions pour le modal. Lorsque vous avez terminé de configurer le modal, fermez-le. Notez que le modal que vous avez créé se trouve au-dessus du corps de la structure de votre page dans l'arborescence de contenu. {#bind-event-component__substeps_fhn_l3b_snb} 7. Liez un événement à un composant de bouton. Vous liez un événement au bouton pour déclencher une action. Sélectionnez le composant de bouton pour le mettre à nouveau en surbrillance, soit dans l'arborescence de contenu, soit sur la page. 1. Sélectionnez + Ajouter du contenu dans l'arborescence de contenu. 2. Sélectionnez le composant Bouton dans la boîte à outils. 3. Sélectionnez Aucun lorsque vous êtes invité à choisir un paramètre prédéfini. 4. Dans le volet Configuration, cliquez sur Événements. 5. Sélectionnez Ajouter un gestionnaire. Seul l'événement \<\< bouton cliqué \>\> est associé au composant de bouton. D'autres composants peuvent avoir plus d'un événement. 6. Sélectionnez un gestionnaire que vous souhaitez affecter au bouton. Par exemple, pour ajouter un gestionnaire d'événements pour le composant bouton, vous pouvez le lier à une autre destination et ajouter des notifications d'alerte. Dans cet exemple, vous pouvez choisir Ouvrir ou fermer la boîte de dialogue modale pour que le bouton ouvre le modal que vous avez créé précédemment. Dans ce scénario de bouton, sélectionnez le gestionnaire d'événements de la boîte de dialogue modale Confirmer et détruire que vous avez créé précédemment. 7. Sélectionnez Continuer. 8. Sélectionnez un modal dans la liste déroulante. 9. Sélectionnez Ajouter pour ajouter le gestionnaire d'événements modaux à votre composant de bouton. {#bind-event-component__substeps_mrb_rrf_zzb} 8. Cliquez sur Enregistrer. 9. Testez le modal en sélectionnant Aperçu. 10. Pour déclencher le modal que vous avez créé, cliquez sur le bouton sur la page.