g_modal (Next Experience) : client

  • Rversion finale: Zurich
  • Mis à jour 31 juil. 2025
  • 19 minutes de lecture
  • L’API g_modal vous permet d’afficher une fenêtre modale pour améliorer les fonctionnalités de l’application.

    Utilisez cette API pour afficher les modaux dans les espaces de travail.

    À l’aide de cette API, vous pouvez :
    • Affichez les champs de type d’entrée dans une fenêtre modale.
    • Afficher un élément dans un cadre, tel qu’une page d’interface utilisateur ou un lien externe.
    • Effectuez une action sur confirmation de l’utilisateur.
    • Chargez un composant.
    • Utilisez le HTML pour renseigner le contenu d’une fenêtre modale.

    g_modal (Next Experience) - alert(titre de chaîne, message de chaîne, rappel de fonction, objet de style)

    Affiche un message d’alerte relatif à une action d’interface utilisateur.

    Tableau 1. Paramètres
    Nom Type Description
    Titre Chaîne Facultatif. Titre à afficher dans l’en-tête du modal.

    Par défaut : alerte

    message Chaîne Message à afficher dans le corps du modal.
    Remarque :
    Si vous ne transmettez qu’un seul paramètre, la méthode le traite comme le message paramètre.
    rappel Fonction Facultatif. Fonction à appeler après l’envoi et le traitement du formulaire sur le serveur.
    La fonction de rappel a la forme callbackFunction(String action_verb, String sys_id, String table, String displayValue) où :
    • action_verb: nom de l’action d’interface utilisateur exécutée. Exemples :
      • sysverb_cancel (bouton Annuler)
      • sysverb_insert (bouton Soumettre)
      • sysverb_save (bouton Enregistrer)
    • sys_id: Sys_id de l’enregistrement affecté.
    • table: nom de la table contenant l’enregistrement.
    • displayValue: valeur affichée sur le formulaire.

    Par défaut : aucun traitement supplémentaire

    style Objet Facultatif. Style du bouton de confirmation à afficher dans le modal.
    "style": {
      "buttonTitle": "String",
      "buttonType": "String"
    }
    style.buttonTitle Chaîne Facultatif. Texte à afficher sur le bouton de confirmation.

    Par défaut : OK

    style.buttonType Chaîne Facultatif. Type de bouton de confirmation à afficher.

    Par défaut : par défaut

    Tableau 2. Renvoie
    Type Description
    Promesse Si un paramètre est transmis, renvoie la callback promesse en cas de réussite, l’erreur dans le cas contraire.

    Si un callback paramètre n’est pas transmis, la méthode renvoie toujours un mot de passe.

    L’exemple de code suivant montre comment appeler cette méthode pour afficher un message d’alerte 'Seul le destinataire affecté peut mettre fin à cette action.'.

    function onClick(g_form) {
    
      if (g_user.userID != g_form.getValue('assigned_to')) {
        g_modal.alert('Only the assigned to can end this action.');
        return;
      }
    
      var msg = getMessage("Are you sure you want to take this action?");
      g_modal.confirm(getMessage("Confirmation"), msg, function (confirmed) {
        if (confirmed) {
          g_form.setValue('state', 'closed_complete');
          g_form.save();
        }
      });
    
      return false;
    }

    g_modal (Next Experience) - confirm(Titre de chaîne, Message de chaîne, Rappel de fonction, Objet de style)

    Affiche un message de confirmation relatif à une action d’interface utilisateur.

    Tableau 3. Paramètres
    Nom Type Description
    Titre Chaîne Facultatif. Titre à afficher dans l’en-tête du modal.

    Par défaut : confirmer

    message Chaîne Message à afficher dans le corps du modal.
    Remarque :
    Si vous ne transmettez qu’un seul paramètre, la méthode le traite comme le message paramètre.
    rappel Fonction Facultatif. Fonction à appeler après l’envoi et le traitement du formulaire sur le serveur.
    La fonction de rappel a la forme callbackFunction(String action_verb, String sys_id, String table, String displayValue) où :
    • action_verb: nom de l’action d’interface utilisateur exécutée. Exemples :
      • sysverb_cancel (bouton Annuler)
      • sysverb_insert (bouton Soumettre)
      • sysverb_save (bouton Enregistrer)
    • sys_id: Sys_id de l’enregistrement affecté.
    • table: nom de la table contenant l’enregistrement.
    • displayValue: valeur affichée sur le formulaire.

    Par défaut : aucun traitement supplémentaire

    style Objet Facultatif. Style des boutons de confirmation et d’annulation à afficher dans le modal.
    "style": {
      "cancelTitle": "String",
      "cancelType": "String",
      "confirmTitle": "String",
      "confirmType": "String"
    }
    style.cancelTitle Chaîne Facultatif. Texte à afficher sur le bouton Annuler.

    Par défaut : Annuler

    style.cancelType Chaîne Facultatif. Type de bouton d’annulation à afficher.

    Valeurs valides :

    • Confirmer (fond bleu)
    • Par défaut (fond blanc)
    • Destructeur (fond rouge)

    Par défaut : confirmer

    style.confirmTitle Chaîne Facultatif. Texte à afficher sur le bouton de confirmation.

    Par défaut : OK

    style.confirmType Chaîne Facultatif. Type de bouton de confirmation à afficher.

    Valeurs valides :

    • Confirmer (fond bleu)
    • Par défaut (fond blanc)
    • Destructeur (fond rouge)

    Par défaut : par défaut

    Tableau 4. Renvoie
    Type Description
    Promesse Si un paramètre est transmis, renvoie la callback promesse en cas de réussite, l’erreur dans le cas contraire.

    Si un callback paramètre n’est pas transmis, la méthode renvoie toujours un mot de passe.

    L’exemple de code suivant montre comment appeler cette méthode pour afficher le message de confirmation « Voulez-vous vraiment effectuer cette action ? »

    function onClick(g_form) {
    
      if (g_user.userID != g_form.getValue('assigned_to')) {
        g_modal.alert('Only the assigned to can end this action.');
        return;
      }
    
      var msg = getMessage("Are you sure you want to take this action?");
      g_modal.confirm(getMessage("Confirmation"), msg, function (confirmed) {
        if (confirmed) {
          g_form.setValue('state', 'closed_complete');
          g_form.save();
        }
      });
    
      return false;
    }

    Sortie :


    Capture d’écran montrant la fenêtre modale de confirmation générée par le code

    g_modal (Next Experience) : confirmDestroy(titre de chaîne, message de chaîne, rappel de fonction, objet de style)

    Affiche un message de confirmation associé à une action d’interface utilisateur, avec le bouton de confirmation affichant un style destructeur.

    Tableau 5. Paramètres
    Nom Type Description
    Titre Chaîne Facultatif. Titre à afficher dans l’en-tête du modal.

    Par défaut : confirmer

    message Chaîne Message à afficher dans le corps du modal.
    Remarque :
    Si vous ne transmettez qu’un seul paramètre, la méthode le traite comme le message paramètre.
    rappel Fonction Facultatif. Fonction à appeler après l’envoi et le traitement du formulaire sur le serveur.
    La fonction de rappel a la forme callbackFunction(String action_verb, String sys_id, String table, String displayValue) où :
    • action_verb: nom de l’action d’interface utilisateur exécutée. Exemples :
      • sysverb_cancel (bouton Annuler)
      • sysverb_insert (bouton Soumettre)
      • sysverb_save (bouton Enregistrer)
    • sys_id: Sys_id de l’enregistrement affecté.
    • table: nom de la table contenant l’enregistrement.
    • displayValue: valeur affichée sur le formulaire.

    Par défaut : aucun traitement supplémentaire

    style Objet Facultatif. Style des boutons de confirmation et d’annulation à afficher dans le modal.
    "style": {
      "cancelTitle": "String",
      "cancelType": "String",
      "confirmTitle": "String",
      "confirmType": "String"
    }
    style.cancelTitle Chaîne Facultatif. Texte à afficher sur le bouton Annuler.

    Par défaut : Annuler

    style.cancelType Chaîne Facultatif. Type de bouton d’annulation à afficher.

    Valeurs valides :

    • Confirmer (fond bleu)
    • Par défaut (fond blanc)
    • Destructeur (fond rouge)

    Par défaut : confirmer

    style.confirmTitle Chaîne Facultatif. Texte à afficher sur le bouton de confirmation.

    Par défaut : OK

    style.confirmType Chaîne Facultatif. Type de bouton de confirmation à afficher.

    Par défaut : destructeur

    Tableau 6. Renvoie
    Type Description
    Promesse Si un paramètre est transmis, renvoie la callback promesse en cas de réussite, l’erreur dans le cas contraire.

    Si un callback paramètre n’est pas transmis, la méthode renvoie toujours un mot de passe.

    Cet exemple de code montre comment appeler la méthode confirmDestroy() pour afficher un modal de confirmation avec un bouton OK rouge.

    function callback(value){ 
      value ? console.log("confirm destroy callback") : console.log('cancel callback'); 
    }
    
    function onClick(g_form) {
      g_modal.confirmDestroy("Confirm Destroy Title", "Confirm Destroy Message", callback, {
        cancelTitle: "Cancel",
        confirmTitle: "Confirm",
        cancelType: "destructive",
        confirmType: "confirm"
      })
    
      .then( 
    
        function test() {
          g_form.setValue("state', '7");
        }, 
    
        function fail() {
          g_form.setValue("state", 2)
        } 
      )
    }

    Sortie :


    Confirmer la destruction modale

    g_modal (Next Experience) : richText(String title, String richText, Function callback, String size, String cancelTitle, String confirmTitle, String cancelType, String confirmType, Object resizableConfig)

    Affiche un modal qui utilise le code HTML transmis pour générer le contenu dans le modal.

    Tableau 7. Paramètres
    Nom Type Description
    Titre Chaîne Facultatif. Titre à afficher dans l’en-tête du modal.

    Valeur par défaut : vide

    Texte enrichi Chaîne Contenu HTML à afficher dans le modal.
    Remarque :
    Cette méthode supprime les <![CDATA[<script>balises ]]> , JavaScript en ligne et d’autres éléments susceptibles de constituer des failles de sécurité.
    rappel Fonction Facultatif. Fonction à appeler après l’envoi et le traitement du formulaire sur le serveur.
    La fonction de rappel a la forme callbackFunction(String action_verb, String sys_id, String table, String displayValue) où :
    • action_verb: nom de l’action d’interface utilisateur exécutée. Exemples :
      • sysverb_cancel (bouton Annuler)
      • sysverb_insert (bouton Soumettre)
      • sysverb_save (bouton Enregistrer)
    • sys_id: Sys_id de l’enregistrement affecté.
    • table: nom de la table contenant l’enregistrement.
    • displayValue: valeur affichée sur le formulaire.

    Par défaut : aucun traitement supplémentaire

    cancelTitle Chaîne Facultatif. Texte à afficher sur le bouton Annuler.

    Par défaut : Annuler

    confirmTitle Chaîne Facultatif. Texte à afficher sur le bouton de confirmation.

    Par défaut : OK

    cancelType Chaîne Facultatif. Type de bouton d’annulation à afficher.

    Valeurs valides :

    • Confirmer (fond bleu)
    • Par défaut (fond blanc)
    • Destructeur (fond rouge)

    Par défaut : confirmer

    confirmType Chaîne Facultatif. Type de bouton de confirmation à afficher.

    Valeurs valides :

    • Confirmer (fond bleu)
    • Par défaut (fond blanc)
    • Destructeur (fond rouge)

    Par défaut : par défaut

    Config redimensionnable Objet Facultatif. Paramètres de configuration pour le redimensionnement du modal associé. Si vous ne souhaitez pas que les utilisateurs puissent redimensionner le modal, ne transmettez pas ce paramètre.
    resizableConfig:
      {
        enableResizable: Boolean,
        resizableMaxHeight: Number,
        resizableMaxWidth: Number,
        resizableMinHeight: Number,
        resizableMinWidth: Number 
      }

    Par défaut : le modal n’est pas redimensionnable.

    resizableConfig.enableResizable Booléen Marqueur indiquant si les utilisateurs peuvent redimensionner le modal associé.
    Valeurs valides :
    • vrai : le modal est redimensionnable. Les poignées de redimensionnement apparaissent sur les bordures du modal.
    • faux : le modal n’est pas redimensionnable.

    Valeur par défaut : false

    resizableConfig.resizableMaxHeight Numéro Hauteur redimensionnable maximale du modal.

    Type de données : nombre

    Unité : Pixels

    Par défaut : hauteur de la fenêtre.

    resizableConfig.resizableMinHeight Numéro Hauteur minimale redimensionnable du modal.

    Type de données : nombre

    Unité : Pixels

    Par défaut : 600px

    resizableConfig.resizableMaxWidth Numéro Largeur redimensionnable maximale du modal.

    Type de données : nombre

    Unité : Pixels

    Par défaut : largeur de la fenêtre

    resizableConfig.resizableMinWidth Numéro Largeur minimale redimensionnable du modal.

    Type de données : nombre

    Unité : Pixels

    Par défaut : 380px

    Tableau 8. Renvoie
    Type Description
    Promesse Si un paramètre est transmis, renvoie la callback promesse en cas de réussite, l’erreur dans le cas contraire.

    Si un callback paramètre n’est pas transmis, la méthode renvoie toujours un mot de passe.

    L’exemple de code suivant montre comment afficher le texte « Ceci est du texte enrichi » en gras dans le modal associé.

    function callback(value){
      value ? console.log("confirm richtext callback") : console.log('cancel rich text callback'); 
    } 
    
    function onClick(g_form) {
      g_modal.richText("RichTextTitle", "<b>This is rich text</b>", callback, {
        cancelTitle: "Rich Cancel",
        confirmTitle: "Rich Confirm"
      }) 
    
      .then(
        function test() {
          g_form.setValue("state', '7"); 
        }, 
    
        function fail() {
          g_form.setValue("state", 2) 
        }
      )
    }

    Sortie :


    Modal de texte enrichi

    g_modal (Next Experience) : showFields(titre de chaîne, champs de tableau, rappel de fonction, taille de chaîne, chaîne cancelTitle, chaîne confirmTitle, chaîne cancelType, chaîne confirmType, objet redimensionnableConfig, instruction de chaîne)

    Affiche une fenêtre modale contenant les champs spécifiés et un bouton OK et Annuler par défaut.

    Tableau 9. Paramètres
    Nom Type Description
    Titre Chaîne Facultatif. Titre à afficher dans l’en-tête du modal.

    Par défaut : " »

    champs Tableau d'objets Liste des champs à afficher dans le modal. Chaque champ est défini dans un objet distinct. Les fields paramètres que vous transmettez dépendent du type de champ (fields.type) spécifié.

    Les champs s’affichent dans le modal dans le même ordre que celui dans lequel ils apparaissent dans le tableau.

    fields: [
      {
        autoFocus: Boolean,
        choices: "Array",
        display_value_list: "String",
        enableMentions: Boolean,
        label: "String",
        mandatory: Boolean,
        name: "String",
        referringTable: "String",
        referringRecordId: "String",
        type: "String",
        value: "String"
      }
    ]
    champs.Mise au point automatique Booléen Facultatif. Marqueur indiquant si le champ doit être mis au point automatiquement par défaut lorsque le modal se charge. Un seul champ doit avoir cette valeur définie sur vrai.
    Valeurs valides :
    • vrai : mise au point automatique.
    • faux : Ne faites pas la mise au point automatique.

    Valeur par défaut : false

    champs.Choix Tableau d'objets Requis si le fields.type paramètre est défini sur choix. Liste des options à afficher dans le champ de liste associé. Chaque entrée de la liste de choix doit être spécifiée en tant qu’objet distinct dans le tableau de choix .
    Par exemple :
    choices: [
      {
        displayValue: "String",
        value: "String
      }
    ]
    champs.Choix.Valeur d’affichage Chaîne Facultatif. Valeur à afficher dans le champ de liste.

    Valeur par défaut : vide

    champs.choix.valeur Chaîne Facultatif. Valeur interne de la valeur affichée dans le champ de liste.

    Valeur par défaut : nul

    champs.display_value_list Tableau de chaînes Facultatif. Liste des chaînes à afficher. Par exemple, ['item1', 'item2', 'item3'].
    champs.enableMentions Booléen Requis si c’est fields.typehtml. Marqueur indiquant si vous pouvez mentionner un utilisateur dans le modal.
    Valeurs valides :
    • vrai : les utilisateurs peuvent être mentionnés dans le modal.
    • faux : les utilisateurs ne peuvent pas être mentionnés dans le modal.

    Valeur par défaut : false

    champs.étiquette Chaîne Facultatif. Texte à afficher comme étiquette pour ce champ dans le modal.

    Valeur par défaut : vide

    champs.obligatoire Booléen Facultatif. Marqueur indiquant si le champ est obligatoire.
    Valeurs valides :
    • vrai : le champ est obligatoire.
    • false : le champ est facultatif.

    Valeur par défaut : false

    champs.nom Chaîne Nom interne du champ. Si le fields.type paramètre est défini sur référence ou glide_list, il s’agit du champ de référence sur l’enregistrement actuel utilisé pour la recherche.
    fields.referringTable Chaîne Requis si le fields.type paramètre est défini sur référence ou glide_list. Nom de la table à partir de laquelle vous faites référence.

    Par exemple : incident

    champs.referringRecordId Chaîne Requis si le fields.type paramètre est défini sur référence. Sys_id de l’enregistrement que vous appelez dans le formulaire Action d’interface utilisateur.
    fields.type Chaîne Type de champ à afficher dans le modal.

    Chaque type de champ dispose d’un ensemble d’éléments fields.<> qui peuvent être transmis. Les valeurs entre crochets [ ] ci-dessous sont les fields éléments pris en charge par le type associé fields .

    Valeurs valides :

    • Booléen [autofocus, étiquette, obligatoire, nom, valeur]
    • Choix [Autofocus, Choix, Étiquette, Obligatoire, Nom, Valeur]
    • domain_id [étiquette, referringRecordId, referringTable, valeur]
    • glide_list [autofocus, display_value_list, étiquette, nom, obligatoire, referringRecordId, referringTable, valeur]
    • html [autofocus, enableMentions, label, mandatory, name, referringRecordId, referringTable, value]
    • reference [autofocus, label, mandatory, name, reference, referringRecordId, referringTable, value]
    • chaîne [autofocus, étiquette, obligatoire, nom, valeur]
    • Zone de texte [Autofocus, Étiquette, Obligatoire, Nom, Valeur]
    fields.value Chaîne Facultatif. Valeur à afficher dans le champ.

    Par exemple, pour un champ de choix, vous pouvez afficher une invite utilisateur :

    valeur : getMessage(' -- Sélectionner -- ')

    Ou pour un champ de référence, vous pouvez afficher la valeur d’un champ sur le formulaire associé :

    g_form.getValue('caller_id')

    Valeur par défaut : vide

    rappel Fonction Facultatif. Fonction à appeler après l’envoi et le traitement du formulaire sur le serveur.
    La fonction de rappel a la forme callbackFunction(String action_verb, String sys_id, String table, String displayValue) où :
    • action_verb: nom de l’action d’interface utilisateur exécutée. Exemples :
      • sysverb_cancel (bouton Annuler)
      • sysverb_insert (bouton Soumettre)
      • sysverb_save (bouton Enregistrer)
    • sys_id: Sys_id de l’enregistrement affecté.
    • table: nom de la table contenant l’enregistrement.
    • displayValue: valeur affichée sur le formulaire.

    Par défaut : aucun traitement supplémentaire

    taille Chaîne Facultatif.
    Taille du modal.
    Valeurs valides :
    • fw : pleine largeur
    • SM : 420px par 315px
    • MD : 600px par 450px
    • LG : 800px par 600px
    Remarque :
    Si une valeur de pixel est spécifiée, la fenêtre modale occupe tout le navigateur. Par exemple, passer « 1px » rend le modal pleine largeur.

    Par défaut : sm

    cancelTitle Chaîne Facultatif. Texte à afficher sur le bouton Annuler.

    Par défaut : Annuler

    confirmTitle Chaîne Facultatif. Texte à afficher sur le bouton de confirmation.

    Par défaut : OK

    cancelType Chaîne Facultatif. Type de bouton d’annulation à afficher.

    Valeurs valides :

    • Confirmer (fond bleu)
    • Par défaut (fond blanc)
    • Destructeur (fond rouge)

    Par défaut : confirmer

    confirmType Chaîne Facultatif. Type de bouton de confirmation à afficher.

    Valeurs valides :

    • Confirmer (fond bleu)
    • Par défaut (fond blanc)
    • Destructeur (fond rouge)

    Par défaut : par défaut

    Config redimensionnable Objet Facultatif. Paramètres de configuration pour le redimensionnement du modal associé. Si vous ne souhaitez pas que les utilisateurs puissent redimensionner le modal, ne transmettez pas ce paramètre.
    resizableConfig:
      {
        enableResizable: Boolean,
        resizableMaxHeight: Number,
        resizableMaxWidth: Number,
        resizableMinHeight: Number,
        resizableMinWidth: Number 
      }

    Par défaut : le modal n’est pas redimensionnable.

    resizableConfig.enableResizable Booléen Marqueur indiquant si les utilisateurs peuvent redimensionner le modal associé.
    Valeurs valides :
    • vrai : le modal est redimensionnable. Les poignées de redimensionnement apparaissent sur les bordures du modal.
    • faux : le modal n’est pas redimensionnable.

    Valeur par défaut : false

    resizableConfig.resizableMaxHeight Numéro Hauteur redimensionnable maximale du modal.

    Type de données : nombre

    Unité : Pixels

    Par défaut : hauteur de la fenêtre.

    resizableConfig.resizableMinHeight Numéro Hauteur minimale redimensionnable du modal.

    Type de données : nombre

    Unité : Pixels

    Par défaut : 600px

    resizableConfig.resizableMaxWidth Numéro Largeur redimensionnable maximale du modal.

    Type de données : nombre

    Unité : Pixels

    Par défaut : largeur de la fenêtre

    resizableConfig.resizableMinWidth Numéro Largeur minimale redimensionnable du modal.

    Type de données : nombre

    Unité : Pixels

    Par défaut : 380px

    instruction Chaîne Facultatif. Instructions à afficher dans le modal. Ce contenu s’affiche sous le titre de la fenêtre modale et au-dessus du premier champ de la fenêtre modale.

    Par défaut : aucune instruction affichée

    Tableau 10. Renvoie
    Type Description
    Promesse Si un paramètre est transmis, renvoie la callback promesse en cas de réussite, l’erreur dans le cas contraire.

    Si un callback paramètre n’est pas transmis, la méthode renvoie toujours un mot de passe.

    L’exemple suivant montre l’invitation d’un utilisateur à indiquer un motif à l’aide d’une fenêtre modale, puis son renvoi au champ Notes de travail de l’enregistrement. La méthode then() renvoie une promesse, qui renvoie ce que le modal renvoie ; fieldValues dans ce cas. Le champ Notes de travail côté client, avec la valeur du champ, se trouve dans le tableau updatedFields . Étant donné qu’un seul champ est renvoyé, l’exemple suppose une position d’index de 0.

    function onClick(g_form) {
        g_modal.showFields({
            title: "Enter your reason",
            fields: [{
                type: 'textarea',
                name: 'work_notes',
                label: getMessage('Reason'),
                mandatory: true
            }],
            size: 'lg'
        }).then(function(fieldValues) {
            g_form.setValue('work_notes', fieldValues.updatedFields[0].value);
            g_form.save();
        });
    }

    Sortie :

    Capture d’écran d’une fenêtre modale produite par le code associé.

    L’exemple suivant développe l’exemple ci-dessus, en ajoutant des champs de choix et de référence.

    function onClick(g_form) {
    
        var fields = [{
            type: 'textarea',
            name: 'work_notes',
            label: getMessage('Reason'),
            mandatory: true
        },
        {
            type: 'choice',
            name: 'reason_code',
            label: getMessage('Reason code'),
            value: getMessage(' -- Select -- '),
            choices: [
              {
                displayValue: 'Duplicate',
                value: 'duplicate'
              },
              {
                displayValue: 'Canceled',
                value: 'canceled'
              }
            ],
            mandatory: true
        },
        {
            type: 'reference',
            name: 'caller_id',
            label: getMessage('What is your name?'),
            mandatory: true,
            reference: 'sys_user',
            referringTable: 'incident',
            referringRecordId: g_form.getUniqueValue(),
    	 value: g_form.getValue('caller_id'),
    	 displayValue: g_form.getDisplayValue('caller_id')
        }
      ];
    
      g_modal.showFields({
        title: "Enter your reason",
        fields: fields,
        size: 'lg'
      }).then(function(fieldValues) {
            g_form.setValue('work_notes', fieldValues.updatedFields[0].value);
            g_form.setValue('caller_id', fieldValues.updatedFields[2].value);
            g_form.save();
      });
    }

    Sortie :

    Capture d’écran d’une fenêtre modale produite par le code associé.

    L’exemple suivant montre comment utiliser cette méthode pour afficher un modal qui contient des types de champ zone de texte, choix, référence, glide_list et domain_id.

    function onClick(g_form) {
      var fields = [
        {
          type: 'textarea',
          name: 'work_notes',
          label: getMessage('Reason'),
          mandatory: true
        },
        {
          type: 'choice',
          name: 'reason_code',
          label: getMessage('Reason code'),
          value: getMessage(' -- Select -- '),
          choices: [
            {
              displayValue: 'Duplicate',
              value: 'duplicate'
            },
            {
              displayValue: 'Canceled',
              value: 'canceled'
            }
          ],
          mandatory: true
        },
        {
          type: 'reference',
          name: 'caller_id',
          label: getMessage('What is your name?'),
          mandatory: true,
          referringTable: 'incident',
          referringRecordId: g_form.getUniqueValue(),
          value: g_form.getValue('caller_id')
        },
        {
          type: 'glide_list',
          name: 'watch_list',
          label: 'A list', 
          mandatory: false,
          referringTable: 'incident',
          referringRecordId: g_form.getUniqueValue(),
          value: '628,9ee1,f298d',
          display_value_list: ['item1', 'item2', 'item3']
        },
        {
          label: 'Domain ID',
          type: 'domain_id',
          value: 'c90d4b084a362312013398f051272c0d',
          displayValue: 'TOP/ACME',
          referringRecordId: '552c48888c033300964f4932b03eb092',
          referringTable: 'incident'
        }
      ];
    
      g_modal.showFields({
        title: "Enter your reason",
        fields: fields,
        size: 'lg'
      }).then(function(fieldValues) {
    
      });
    }

    Sortie :


    Capture d’écran du modal

    g_modal (Next Experience) : showFrame(String title, String url, Function callback, String size, String height, String modalHeight, String modalWidth, Boolean showClose, String autoCloseOn, Boolean hasLoadingMessage, Boolean closeOnEscape, Boolean hideOverlay, Object resizableConfig)

    Affiche un modal qui utilise un lien vers une URL externe ou une page d’interface utilisateur pour son contenu.

    Tableau 11. Paramètres
    Nom Type Description
    Titre Chaîne Facultatif. Titre à afficher dans l’en-tête du modal.

    Valeur par défaut : vide

    URL Chaîne URL des informations à charger dans l’IFrame.
    Remarque :
    Si un seul argument est transmis, il est traité comme le url paramètre.
    rappel Fonction Facultatif. Fonction à appeler après l’envoi et le traitement du formulaire sur le serveur.
    La fonction de rappel a la forme callbackFunction(String action_verb, String sys_id, String table, String displayValue) où :
    • action_verb: nom de l’action d’interface utilisateur exécutée. Exemples :
      • sysverb_cancel (bouton Annuler)
      • sysverb_insert (bouton Soumettre)
      • sysverb_save (bouton Enregistrer)
    • sys_id: Sys_id de l’enregistrement affecté.
    • table: nom de la table contenant l’enregistrement.
    • displayValue: valeur affichée sur le formulaire.

    Par défaut : aucun traitement supplémentaire

    taille Chaîne Facultatif. Taille du modal.
    Valeurs valides :
    • fw : pleine largeur
    • SM : 420 px par 253,25 px
    • MD : 600 px par 253,25 px
    • LG : 800 px x 254 px

    Par défaut : lg

    hauteur Chaîne Facultatif. Hauteur de la section de contenu dans le modal. Cette valeur est au format « <numéro><unité> », comme « 80 % » ou « 300 px ». Si vous ne transmettez qu’un nombre, la méthode suppose que l’unité de mesure est le pixel.
    Unités de mesure valides :
    • %
    • Em
    • px
    • VH

    Par défaut : 100 % ou 153,75 px

    modalHeight Chaîne Facultatif. Hauteur du modal. Cette valeur est au format « <numéro><unité> », comme « 80 % » ou « 300 px ». Si vous ne transmettez qu’un nombre, la méthode suppose que l’unité de mesure est le pixel.
    Unités de mesure valides :
    • %
    • Em
    • px
    • VH

    Par défaut : 254px

    Largeur modale Chaîne Facultatif. Largeur du modal. Cette valeur est au format « <numéro><unité> », comme « 80 % » ou « 300 px ». Si vous ne transmettez qu’un nombre, la méthode suppose que l’unité de mesure est le pixel.
    Unités de mesure valides :
    • %
    • Em
    • px
    • VH

    Par défaut : 800px

    showClose Booléen Facultatif. Marqueur indiquant si l’icône de fermeture (X) apparaît dans le coin supérieur droit du modal.
    Valeurs valides :
    • true : affiche l’icône Fermer.
    • faux : n’affiche pas l’icône Fermer.

    Par défaut : true

    autoCloseOn Chaîne Facultatif. Condition sur laquelle fermer automatiquement le modal.
    Valeurs valides :
    • EMPTY_BODY
    • URL_CHANGED

    Par défaut : ne ferme pas automatiquement le modal.

    hasLoadingMessage Booléen Facultatif. Marqueur indiquant s’il faut afficher le message Chargement... dans l’emplacement de contenu du modal avant de charger le contenu du modal.
    Valeurs valides :
    • true : affiche le message de chargement.
    • false : n’affiche pas le message de chargement. L’emplacement de contenu du modal est vide avant le chargement du contenu.
    Remarque :
    Vous ne pouvez pas personnaliser le champ « Chargement en cours... » Message; Configurez uniquement s’il s’affiche ou non.

    Valeur par défaut : false

    closeOnEscape Booléen Facultatif. Marqueur indiquant si l’utilisateur peut fermer le modal en appuyant sur la touche Echap.
    Valeurs valides :
    • true : la fenêtre modale se ferme lorsque l’utilisateur appuie sur la touche Echap.
    • false : le modal ne se ferme pas lorsque l’utilisateur appuie sur la touche Echap.

    Valeur par défaut : false

    hideOverlay Booléen Facultatif. Marqueur indiquant s’il faut afficher la superposition gris transparent sur la page d’enregistrement.
    Valeurs valides :
    • true : masquez la superposition grise transparente sur la page d’enregistrement.
    • false : affiche la superposition grise transparente sur la page d’enregistrement.

    Valeur par défaut : false

    Config redimensionnable Objet Facultatif. Paramètres de configuration pour le redimensionnement du modal associé. Si vous ne souhaitez pas que les utilisateurs puissent redimensionner le modal, ne transmettez pas ce paramètre.
    resizableConfig:
      {
        enableResizable: Boolean,
        resizableMaxHeight: Number,
        resizableMaxWidth: Number,
        resizableMinHeight: Number,
        resizableMinWidth: Number 
      }

    Par défaut : le modal n’est pas redimensionnable.

    resizableConfig.enableResizable Booléen Marqueur indiquant si les utilisateurs peuvent redimensionner le modal associé.
    Valeurs valides :
    • vrai : le modal est redimensionnable. Les poignées de redimensionnement apparaissent sur les bordures du modal.
    • faux : le modal n’est pas redimensionnable.

    Valeur par défaut : false

    resizableConfig.resizableMaxHeight Numéro Hauteur redimensionnable maximale du modal.

    Type de données : nombre

    Unité : Pixels

    Par défaut : hauteur de la fenêtre.

    resizableConfig.resizableMinHeight Numéro Hauteur minimale redimensionnable du modal.

    Type de données : nombre

    Unité : Pixels

    Par défaut : 600px

    resizableConfig.resizableMaxWidth Numéro Largeur redimensionnable maximale du modal.

    Type de données : nombre

    Unité : Pixels

    Par défaut : largeur de la fenêtre

    resizableConfig.resizableMinWidth Numéro Largeur minimale redimensionnable du modal.

    Type de données : nombre

    Unité : Pixels

    Par défaut : 380px

    Tableau 12. Renvoie
    Type Description
    Promesse Renvoie la promesse en cas de réussite, l’erreur dans le cas contraire. Cette promesse est résolue lorsque le modal IFrame est fermé.

    L’exemple suivant montre comment afficher un article de la base de connaissances dans un modèle à l’aide de la sys_id de l’enregistrement de l’article de la base de connaissances et d’une URL de base.

    function onClick(g_form) {
      var kbId = '24d9243187032100deddb882a2e3ec33'; //sysId of KB article
      g_modal.showFrame({
        url: '/kb_view.do?sys_kb_id=' + kbId,
        title: 'Test Knowledge Article',
        size: 'lg',
        height: 500px
      });
    }

    Sortie :

    Capture d’écran du modal généré par le code

    Cet exemple montre comment utiliser une page d’interface utilisateur incorporée lors de la création d’un modal. Elle utilise window.parent.postMessage() dans la page d’interface utilisateur pour transmettre les données de l’iFrame à l’espace de travail, car l’API g_form n’est pas accessible dans une page d’interface utilisateur lorsqu’elle se trouve dans l’iFrame.

    function onClick(g_form) {
      function proposeMIC(data) {
        var workNotes = data.msg + "\n" + data.workNotes;
        var notes = g_form.getValue('work_notes') + ' ' + workNotes;
        var bi = g_form.getValue('business_impact') + ' ' + data.businessImpact;
        g_form.setValue('work_notes', notes.trim());
        g_form.setValue('business_impact', bi.trim());
        g_form.submit('sysverb_mim_propose');
      }
    	
      function openPopup() {
        if(!g_form.getControl('work_notes')) {
          getMessage('Cannot propose major incident as "Worknotes" is not visible', function(msg) {
    	 g_form.addErrorMessage(msg);
          });
          return false;
        }
    
        var url = "/sn_major_inc_mgmt_mim_propose.do?sysparm_stack=no&sysparm_workspace=" + true;
        g_modal.showFrame({
          title: getMessage("Propose Major Incident"),
          url: url,
          size: 'lg',
          autoCloseOn: 'URL_CHANGED',
          callback: function (ret, data) {
            if (ret)
              proposeMIC(data);
          }
        });
      }
    	
      openPopup();
    }

    Sortie :


    Capture d’écran du modal généré par le code