Cas d’utilisation de scripts côté client
Les cas d’utilisation des scripts côté client incluent l’affichage de messages de champ, la modification des couleurs de formulaire, l’ajout de champs et la création d’actions d’acheminement d’interface utilisateur.
Ajouter un champ à la validation du catalogue de services
Ceci est un exemple d’ajout d’un champ Société au paiement sous le champ Demandé pour à l’aide de macros de mise en page autres que celles du panier, c’est-à-dire glide.sc.use_cart_layoutsest faux.
Avant de commencer
Rôle requis : admin
Pourquoi et quand exécuter cette tâche
Ce champ transfère une valeur fournie au champ Société de la demande de Catalogue de services.
Cet exemple fait les hypothèses suivantes :
- Instance utilisant la validation en deux étapes. Si la validation de l’achat en deux étapes n’est pas activée, activez-la avant de commencer. Pour plus d'informations, consultez Service Catalog checkout models.
- Cet exemple renseigne le champ Société sur le formulaire de demande de Catalogue de services. Si le champ n’apparaît pas sur le formulaire, configurez le formulaire avant de commencer. Pour obtenir des instructions, consultez Personalize a form.
Procédure
Résultats
Ajouter la fonctionnalité de remplissage automatique
L’ajout de la fonctionnalité de remplissage automatique est également appelé modèle d’incident, affectations automatiques, appels rapides, script d’appel ou remplissage automatique.
- Créez une table de recherche.
- Renseignez le champ clé, sous-catégorie.
- Renseignez le champ renseigné automatiquement, Brève description.
function onChange(control, oldValue, newValue, isLoading) {
if (isLoading) { return; }
var newrec = gel('sys_row');
//Check if new record
if (newrec.value == -1) {
var lookup = new GlideRecord('u_short_desc_lookup');
lookup.addQuery('u_subcategory', g_form.getValue('subcategory'));
lookup.query();
var temp; //temp var - reusable
if (lookup.next()) {
temp = lookup.u_short_description;
if (null != temp) { //Set the form value from lookup if there is a lookup value
g_form.setValue('short_description', temp); }
else {
g_form.setValue('short_description', "" ); } }
else {
//If a lookup record does not exist based on lookup.addQuery
//Then set to UNDEFINED or NULL depending on type
g_form.setValue('short_description', ""); } }
}Vous pouvez renseigner de nombreux champs ou importer des questions de script d’appel dans le champ Commentaires afin que le personnel du centre d’appels recueille des informations utiles à transmettre à un technicien.
- Définition d’un champ pour réinitialiser le mot de passe
-
La table de recherche contient un enregistrement avec les paramètres de clé et de remplissage automatique suivants :
- Sous-catégorie = Mot de passe
- Description brève = Réinitialisation du mot de passe
Changer la couleur du formulaire lors du changement d’état
Change la couleur d’un champ de formulaire du formulaire lors d’un changement d’état. Le script peut facilement être modifié pour ajuster n’importe quelle propriété de n’importe quel objet de la page accessible via le DOM HTML.
Nom : Changer la couleur du formulaire lors d’un changement d’état
Type : Script client
Description : Change la couleur d’un champ de formulaire du formulaire lors d’un changement d’état. Le script peut facilement être modifié pour ajuster n’importe quelle propriété de n’importe quel objet de la page accessible via le DOM HTML.
function onChange(control, oldValue, newValue, isLoading) {
var elementID = gel("incident.priority");
switch(newValue) {
case "1": elementID.style.backgroundColor = "red"; break;
case "2": elementID.style.backgroundColor = "tomato"; break;
case "3": elementID.style.backgroundColor = "orange"; break;
case "4": elementID.style.backgroundColor = "yellow"; break;
case "5": elementID.style.backgroundColor = "green"; break;
default: elementID.style.backgroundColor = "white"; break; } }Créer une action d’acheminement d’interface utilisateur
Cette solution vous permet de créer un enregistrement avec le centre de services sans savoir s’il s’agit d’un incident ou d’un élément de demande ; Le Centre de services peut ensuite acheminer l’enregistrement vers la table appropriée.
Avant de commencer
Rôle requis : admin
Procédure
Afficher les messages du champ
Plutôt que d’utiliser JavaScript alert(), pour un look plus propre, vous pouvez afficher une erreur sur le formulaire lui-même. Les méthodes showFieldMsg() et hideFieldMsg() peuvent être utilisées pour afficher un message juste en dessous du champ lui-même.
showFieldMsg et hideFieldMsg sont des méthodes qui peuvent être utilisées avec l’objet g_form .
Ces méthodes permettent de modifier la vue de formulaire des enregistrements (formulaires Incident, Problème et Changement). Ces méthodes peuvent également être disponibles dans d’autres scripts clients, mais elles doivent être testées pour déterminer si elles fonctionnent comme prévu.
Lorsqu’un message de champ est affiché sur un formulaire lors du chargement, le formulaire défile pour s’assurer que le message de champ est visible. Veiller à ce que les utilisateurs ne manquent pas un message de champ parce qu’il n’était pas à l’écran.
La propriété globale glide.ui.scroll_to_message_field contrôle le défilement automatique des messages lorsque le champ de formulaire est hors écran (fait défiler le formulaire jusqu’au contrôle ou au champ).
| Détail de la méthode | Paramètres | Exemple |
|---|---|---|
| showFieldMsg(entrée, message, type, [scrollform]) |
|
Message d'erreur
Message dinformation
|
| hideFieldMsg(entrée) |
|
Suppression d’un message |
Support hérité
Les méthodes showErrorBox() et hideErrorBox() ne sont pas recommandées.
Utilisation du code client et serveur dans une action d’interface utilisateur
Vous pouvez utiliser un script pour valider une entrée lors d’un clic sur une action d’interface utilisateur côté client avant de mettre à jour l’enregistrement côté serveur. L’utilisateur n’aura pas besoin de cliquer deux fois sur le bouton pour valider les champs obligatoires et mettre à jour l’enregistrement.
Le script appelle la fonction client pour la validation côté client, et l’action d’interface utilisateur termine la tâche si elle réussit. Le code qui s’exécute sans instruction onclick garantit que la fonction côté serveur ne s’exécute pas tant que la fonction cliente n’est pas exécutée. En cas de réussite, la fonction côté serveur s’exécute et met à jour l’enregistrement.
// Client-side onclick function
function resolveIncident() {
// Set the 'Incident state' and 'State' values to 'Resolved', and display mandatory fields
g_form.setValue('incident_state', 6);
g_form.setValue('state', 6);
g_form.setValue('resolved_by', g_user.userID);
// Call the UI action and skip the 'onclick' function
gsftSubmit(null, g_form.getFormElement(), 'resolve_incident'); //MUST call the 'Action name' set in this UI Action
}
// Code that runs without 'onclick'
// Ensure call to server-side function with no browser errors
if (typeof window == 'undefined')
serverResolve();
// Server-side function
function serverResolve() {
current.incident_state = IncidentState.RESOLVED;
current.state = IncidentState.RESOLVED;
current.resolved_by = gs.getUserID();
current.update();
}gsftSubmit(contrôle de chaîne, formulaire d’objet, chaîne action_name)
Soumet un formulaire comme si l’utilisateur avait cliqué sur une action d’interface utilisateur après avoir vérifié les champs obligatoires et exécuté les scripts clients onSubmit( ). Permet d’appeler le code côté client et le code côté serveur dans une seule action d’interface utilisateur.
| Nom | Type | Description |
|---|---|---|
| control | Chaîne | Nom d’un bouton de formulaire sur lequel vous souhaitez simuler un clic utilisateur. Utilisez null sinon. |
| formulaire | Objet | Facultatif. Élément de formulaire qui contient l’entrée soumise. Vous pouvez récupérer cette valeur en appelant la méthode g_form.getFormElement(). |
| action_name | Chaîne | Nom de l’action. Cette valeur est fournie dans l’enregistrement répertorié dans la table Actions d’interface utilisateur [sys_ui_action]. Par exemple, |