Gérer les actions dans les pages du générateur d’IU

  • Rversion finale: Yokohama
  • Mis à jour 30 janv. 2025
  • 9 minutes de lecture
  • 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.

    Actions dans Générateur d'IU

    Les actions de l’interface utilisateur indiquent Générateur d'IU ce qu’il faut faire lorsqu’un événement est déclenché. Un événement est une action effectuée par un utilisateur ou une occurrence qui se produit sur une page. Utilisez les actions d’interface utilisateur pour créer des interfaces interactives et conviviales qui aident vos utilisateurs à accomplir des tâches. Chaque composant est associé à ses propres événements. Les événements comprennent :

    • L’utilisateur clique sur une visualisation de données
    • La page extrait correctement les données
    • L’utilisateur sélectionne une case d’option
    • Chargements de pages

    Types d’événements pouvant déclencher des actions.

    Événements dans Générateur d'IU

    Utilisez un événement pour ajouter des actions à vos composants, pages et ressources de données.

    • Un événement de composant est une action que vous configurez pour un composant. Vous configurez un gestionnaire d’événements pour configurer l’action de ce composant. Par exemple, vous pouvez ajouter un composant de bouton à votre Générateur d'IU page. Ensuite, vous pouvez ajouter un gestionnaire d’événements pour appliquer une action à ce bouton, comme accéder à une page Web.
    • Les événements de page effectuent des actions pour l’intégralité de la page. Vous pouvez configurer les événements de page suivants :
      • Mappages d’événements de la page. Ajoutez, supprimez ou effacez les notifications d’alerte sur votre page.
      • Mappages d’événements de variantes. Ajoutez, supprimez ou effacez les notifications d’alerte sur votre variante de page.
      • Événements expédiés. Créez des événements répartis pour votre page afin de créer des mappages d’événements relayés qui modélisent les événements après un gestionnaire d’événements parent. Sélectionnez un gestionnaire d’événements principal cible pour modéliser les champs de charge utile après celui-ci.
      • Événements traités. Un événement géré est un événement qui est exposé et disponible pour utilisation par d’autres utilisateurs. Une fois que vous avez créé un événement géré, il est disponible sous Page event mappings que d’autres utilisateurs peuvent l’utiliser. Vous pouvez également configurer des champs de charge utile que vous créez manuellement ou choisir un modèle pour votre événement géré, tel qu’une boîte de dialogue modale Ouvrir ou fermer.
    • Les événements de ressources de données mappent les ressources de données pour informer les informations du moment où les données sont extraites.
    • Les événements d’une page ou d’un composant ne font rien tant que l’événement n’est pas mappé à un ou plusieurs gestionnaires d’événements.

    Progression des événements pour différents types d’événements.

    Mappage d’événements dans Générateur d'IU

    Mappez les actions à des événements tels que cliquer sur un bouton ou remplir un champ. Un mappage d’événements est le processus qui vous permet de mapper la charge utile ou les valeurs contextuelles d’un événement à l’objet ou au gestionnaire qui agit sur cet événement.

    Pour plus d’informations sur le mappage d’événements, reportez-vous à la section Définir des événements de carte.

    Gestionnaires d’événements dans Générateur d'IU

    Un gestionnaire d’événements est une action effectuée lorsqu’un événement se produit. En mappant un gestionnaire d’événements à un événement, vous spécifiez l’action ou les actions à entreprendre lorsque l’événement se produit. Utilisez un gestionnaire d’événements pour configurer une action pour votre Générateur d'IU page ou les composants de la page. Par exemple :
    • Cliquez sur une visualisation de données pour ouvrir une liste d’enregistrements représentés dans la visualisation
    • L’extraction réussie des données pour une liste ouvre une alerte qui indique que l’extraction des données a réussi
    • La sélection d’une case d’option ajuste le filtre d’une liste sur la page
    • Le chargement d’une page ouvre un modal pour confirmer l’acceptation des cookies avant de poursuivre

    Lorsque vous ajoutez un gestionnaire d’événements à une page ou à un Générateur d'IU composant, vous pouvez choisir différents types de gestionnaires d’événements. Par exemple, un composant Button peut avoir les types de gestionnaires d’événements suivants :

    • Gestionnaires d’événements hérités. Un gestionnaire d’événements hérité est exposé à partir de la page dans laquelle vous travaillez. Si vous êtes sur la page parente Générateur d'IU , un gestionnaire d’événements hérité peut être exposé à partir de l’interpréteur de commandes d’application. Le tableau suivant répertorie les différents types de gestionnaires d’événements hérités que vous pouvez utiliser et ce que vous pouvez en faire.
      Tableau 1. Gestionnaires d'événements hérités
      Gestionnaire d'événements Description
      URL du fil d’Ariane modifiée
      Lien vers destination Naviguez vers une destination.
      • Acheminements de l’application : lien vers une autre page d’une application, comme un écran d’accueil.
      • URL externe : lien vers un site web ou toute URL externe.
      Exemple de script
          return {
              route: null, /* Page route, e.g. 'record' */
              fields: null, /* Required params, e.g. {"table":"incident","sysId":"X"} */
              params: null, /* Optional params, e.g. {"selectedIndex" : 1} */
              ☑️redirect: null, /* ??? True/false? */
              ☑️passiveNavigation: null, /* Load in background, e.g. 'false' */
              title: null, 
              multiInstField: null, 
              ☑️targetRoute: null, /* ??? */
              ☑️external: null /* ??? True/false? */
          };
      
      Ajouter des paramètres à l'URL Ajouter des paramètres supplémentaires à une URL.
      Exemple de script
      { “selectedTabIndex” : 0 }
      Ouvrir ou fermer la boîte de dialogue modale Après avoir créé un modal, utilisez-le Open or close modal dialog pour le déclencher.
    • Gestionnaires d’événements au niveau de la page. Ce type de gestionnaire d’événements est commun à toutes les pages, et vous pouvez l’utiliser lorsque vous souhaitez ajouter ou effacer des notifications d’alerte au niveau de la page. Le tableau suivant répertorie les différents types de gestionnaires d’événements au niveau de la page que vous pouvez utiliser et ce que vous pouvez en faire.
      Tableau 2. Gestionnaires d'événements au niveau de la page
      Gestionnaire d'événements Description
      Ajouter des notifications d'alerte Ajoutez un extrait de code pour envoyer une notification d’alerte. Par exemple :
      return {
          items: [{"type" : "info", "message" : "Info message", "id" : "optionalID"}] /* Types: info, warning, error */
      };
      
      Supprimer la notification d’alerte Ajoutez un code aux ID de notification d’alerte d’appel que vous souhaitez ignorer. Par exemple, cliquez sur un bouton pour supprimer une notification d’alerte de chargement de page.
      Effacer la notification d’alerte Ajoutez un code pour appeler tous les ID de notification d’alerte que vous souhaitez ignorer. Par exemple, cliquez sur un bouton pour supprimer toutes les notifications d’alerte.
      Définir l'état de chargement Activer/désactiver le chargement. Par exemple, vous pouvez activer/désactiver le chargement pour charger la page lorsque vous cliquez sur un bouton ou désactiver le chargement pour ne pas charger la page lorsque vous cliquez sur un bouton.
      Mettre à jour le paramètre de l'état du client Définissez le paramètre de l’état du client de manière déclarative. Supposons que vous avez un paramètre d’état client que vous configurez avec une valeur. Vous pouvez configurer le gestionnaire d’événements Update client state parameter pour mettre à jour le paramètre de l’état du client avec une nouvelle valeur. Par exemple, vous avez un paramètre d’état client appelé Message d’accueil qui est configuré avec Hello comme valeur initiale. Vous pouvez ajouter un gestionnaire d’événements Update client state parameter , sélectionner le paramètre d’état du client Message d’accueil , puis entrer une nouvelle valeur comme Au revoir. Lorsque vous cliquez sur le bouton, Goodbye remplace Hello sur la page.
      Chargement du Viewport du macroponent UXF demandé Ajoutez à un composant, tel qu’un composant de bouton, pour ouvrir un Viewport. Pour plus d'informations, consultez Ajouter un composant de fenêtre d’affichage à votre page.
    • Gestionnaires de ressources de données. Ce type de gestionnaire d’événements déclenche l’extraction ou l’écriture de données sur le serveur.
      Vous pouvez actualiser les données sources de données de l’interpréteur de commandes d’application sur votre Générateur d'IU page en cliquant sur un bouton. Par exemple, avec un gestionnaire de ressources de données, vous pouvez effectuer les actions suivantes :
      • Lier les données à la description d’un enregistrement d’incident.
      • Modifiez la valeur de la description de l’incident.
      • Ajoutez un composant de bouton à votre page.
      • Étiquetez le bouton comme Actualiser l’incident.
      • Ajoutez un Look Up Record gestionnaire d’événements pour le bouton.
      • Enregistrez votre page.
      • Si la description de l’enregistrement d’incident change, cliquez sur Actualiser pour mettre à jour la description sur votre page.
    • Scripts clients Scripts qui s’exécutent lorsqu’un événement est déclenché sur un composant. Vous créez ces scripts dans la section Scripts clients de .Générateur d'IU Pour plus d'informations, consultez Définir des scripts clients et les lier aux composants.

    Liaison d’événements à des composants dans Générateur d'IU

    Liez les gestionnaires d’événements aux événements d’un composant. Lorsque vous ajoutez des composants à votre Générateur d'IU page, ces composants ne sont pas configurés pour effectuer une action sur votre page. Par exemple, un composant de bouton est statique et ne fait rien tant que vous ne lui avez pas lié une action d’événement, telle que la suppression d’un enregistrement. Certains composants comportent plusieurs événements dans lesquels des gestionnaires d’événements peuvent être affectés. Par exemple, dans le composant de liste, vous pouvez affecter un gestionnaire de navigation à l’événement Row clicked . Vous pouvez également affecter un modal ouvert à l’événement Data fetch failed . Pour plus d'informations, consultez Lier un événement à un composant.

    Liaison des événements aux pages du générateur d’IU

    Liez un événement au niveau de la page pour exécuter des gestionnaires d’événements sur la page. Par exemple, utilisez des événements au niveau de la page pour les notifications de page, le chargement de la page ou lorsqu’une propriété de page change. L’affectation du gestionnaire d’événements à l’événement au niveau de la page est similaire à l’affectation de gestionnaires aux événements des composants.

    Vous pouvez lier des mappages d’événements à l’aide des méthodes suivantes :
    • Mappages d’événements de la page. Ajoutez, supprimez ou effacez les notifications d’alerte sur votre page.
    • Mappages d’événements de variantes. Ajoutez, supprimez ou effacez les notifications d’alerte sur votre variante de page.
    • Événements expédiés. Créez des événements répartis pour votre page afin de créer des mappages d’événements relayés qui modélisent les événements après un gestionnaire d’événements parent. Sélectionnez un gestionnaire d’événements principal cible pour modéliser les champs de charge utile après celui-ci.
    • Événements traités. Ajoutez un événement géré pour un événement qui est exposé et disponible pour utilisation par d’autres utilisateurs.
    Pour plus d'informations, consultez Lier un événement à une page.

    Liaison d’événements à des ressources de données dans Générateur d'IU

    Liez les gestionnaires d’événements aux ressources de données individuelles de votre Générateur d'IU page. Par exemple, lorsqu’une ressource de données extrait avec succès de nouvelles données, elle exécute un gestionnaire d’événements, tel que la navigation, pour amener un utilisateur à l’étape suivante d’un flux. Lorsqu’une ressource de données ajoute avec succès un enregistrement à une table, elle affiche un modal de réussite qui utilise le gestionnaire d’événements show modal. Pour plus d'informations, consultez Lier un événement à une ressource de données.

    Liaison d’événements à des actions déclaratives dans Générateur d'IU

    Lier des éléments de données pour ajouter des actions d’événement à une définition d’action déclarative dans Actions et composants dans le Now Platform®. Par exemple, vous pouvez lier un élément de données pour ajouter une action d’événement afin de terminer le travail sur une table.

    Si vous ajoutez un composant à votre Générateur d'IU page qui a une action déclarative, vous devez le lier à un événement géré. L’événement géré crée une action qui est exécutée lorsqu’un utilisateur sélectionne le composant. En sélectionnant Configurer le mappage des événements d’action déclarative, vous ajoutez un nouveau gestionnaire d’événements pour définir ce que l’action déclarative fait sur la page.

    Configurez l’option de mappage des événements d’action déclarative dans le panneau Configurer.

    Pour plus d'informations, consultez Lier un événement à une action déclarative.