Catlog Item Pop UP

jonathangilbert
Mega Sage

Hello All,

 

We have a requirement from the business on a catalog item to display a specific text in a pop up if a variable option is selected. Normally we would configure this using either a UiPolicy or Client script, but this is why I am wanting to do it a different way.

 

The catalog item at present only has a couple of role options to choose from on a variable. Rather than us as developers constantly adding the new roles in when that team have created them, I want to allow them to add the roles to a spreadsheet which then gets emailed in and automation then adds the addition roles to the variable ( which we currently can do). However for each role they want specific text to be presented in a Pop up, and obviously they can't create UI policies or scripts and it would be time consuming for us developers to keep making changes, so this is the idea I have come up with.

 

I have added  a new field to the "question_choice" table called "Additional Information", where the team can include the text they wish the pop up to display on the incoming spreadsheet import, and then adynamic UI policy or client script can they display the text that was entered, is that possible and if so how ?

sod poc.png

 

The image above shows 2 options each with 2 different comments in the "Additional Information" field, so if "Role A" was selected on the form a popup will appear with the text "There is no known Security constraints" or if "Role B" was selected on the form the pop up would display "There is a possibility this could give"

 

Any ideas and assistance would be greatly appreciated 🙂

1 ACCEPTED SOLUTION

CN-L
Mega Sage

Hi @jonathangilbert,

 

I was curious about this and wanted to see if it was possible in my PDI.

 

Full disclosure: I had some help from ChatGPT as scripting is something that I'm still learning.

 

First, I created a Script Include called "CatalogChoiceInfo" with Glide AJAX enabled

var CatalogChoiceInfo = Class.create();
CatalogChoiceInfo.prototype = Object.extendsObject(AbstractAjaxProcessor, {

    getAdditionalInformation: function() {

        var selectedValue = this.getParameter('sysparm_value');
        var choice = new GlideRecord('question_choice');

        choice.addQuery('question.name', 'role_required');
        choice.addQuery('value', selectedValue);
        choice.setLimit(1);
        choice.query();

        if (choice.next()) {
            return choice.getValue('u_additional_information') || '';
        }

        return '';
    },

type: 'CatalogChoiceInfo'

});

 Then I created an onChange Catalog Client Script against my catalog item

CNL_0-1793960520352.png

 

function onChange(control, oldValue, newValue, isLoading) {
   if (isLoading || newValue == '') {
      return;
   }

   //Nothing selected, nothing to display
   if (!newValue) {
	return;
   }

   // Call the Script Include
   var ga = new GlideAjax('CatalogChoiceInfo');

   ga.addParam('sysparm_name', 'getAdditionalInformation');
   ga.addParam('sysparm_value', newValue);

   // Retrieve the additional information
   ga.getXMLAnswer(function(answer) {

	// Only display a pop up if information exists
	if (answer) {
		spModal.alert(answer);
	}

   });
   
}

 The end result looked like this in Employee Center 

CNL_1-1793960590717.png

 

Now, I'm not saying this is the perfect solution and I'm sure more experienced developers could produce something better however hopefully it can act as a starting point at least and was a good opportunity for me to try something new.

View solution in original post

2 REPLIES 2

CN-L
Mega Sage

Hi @jonathangilbert,

 

I was curious about this and wanted to see if it was possible in my PDI.

 

Full disclosure: I had some help from ChatGPT as scripting is something that I'm still learning.

 

First, I created a Script Include called "CatalogChoiceInfo" with Glide AJAX enabled

var CatalogChoiceInfo = Class.create();
CatalogChoiceInfo.prototype = Object.extendsObject(AbstractAjaxProcessor, {

    getAdditionalInformation: function() {

        var selectedValue = this.getParameter('sysparm_value');
        var choice = new GlideRecord('question_choice');

        choice.addQuery('question.name', 'role_required');
        choice.addQuery('value', selectedValue);
        choice.setLimit(1);
        choice.query();

        if (choice.next()) {
            return choice.getValue('u_additional_information') || '';
        }

        return '';
    },

type: 'CatalogChoiceInfo'

});

 Then I created an onChange Catalog Client Script against my catalog item

CNL_0-1793960520352.png

 

function onChange(control, oldValue, newValue, isLoading) {
   if (isLoading || newValue == '') {
      return;
   }

   //Nothing selected, nothing to display
   if (!newValue) {
	return;
   }

   // Call the Script Include
   var ga = new GlideAjax('CatalogChoiceInfo');

   ga.addParam('sysparm_name', 'getAdditionalInformation');
   ga.addParam('sysparm_value', newValue);

   // Retrieve the additional information
   ga.getXMLAnswer(function(answer) {

	// Only display a pop up if information exists
	if (answer) {
		spModal.alert(answer);
	}

   });
   
}

 The end result looked like this in Employee Center 

CNL_1-1793960590717.png

 

Now, I'm not saying this is the perfect solution and I'm sure more experienced developers could produce something better however hopefully it can act as a starting point at least and was a good opportunity for me to try something new.

That is brilliant it works exactly how I would have liked it to, Thankyou so much