Change Help text based on multiple choice selection?

othomas1
Kilo Guru

Hello community members,

Does anyone know if there is a way to display different help text based on selections made on a multiple choice variable? I have text now, but it displays the same no matter what choice is selected.

 

find_real_file.png

1 REPLY 1

Rajesh Mushke
Mega Sage
Mega Sage

Hey Thomos,

 

OOB there is no way to display Tooltip/Helptext for individual choice Value in Service Catalog Variables. But this can be certainly achieved as per the steps mentioned below with some coding:

 

 

 

1) Create a Variable say a Select Box with your required choices defined. For example I have created a Variable called "City" with choices as "Melbourne and Sydney" as shown below:

 

 

 

find_real_file.png

 

 

 

find_real_file.png

 

 

 

 

 

2)   Now create a field with type as "String" similar to the name of the Variable created above for ease in any of the Custom Table or any other table suitable as per your instance design. For example I have created a field called "City(u_city)" in my Custom Table "ACL Testing(u_acl_testing)" with the Same choices defined as that in the Variable. Same has been shown below:

 

 

 

find_real_file.png

 

 

 

find_real_file.png

 

 

 

 

 

3) Once the field has been created and Choices has been defined in your desired Table then Navigate back to your catalog Item and create a new Variable called say Detailed Description(Don't Worry about this Variable, Once all the Configurations are done we are going to hide this Variable from all views)   with Type as Multi Line Text and default Value specified as per the below script:

 

 

 

Script:

 

 

 

javascript: (function getChoiceList() {  

 

 

 

  var arr = [];  

 

  var choices = new GlideRecord('sys_choice');  

 

  choices.addQuery('name', 'u_acl_testing');                               //Replace your Table Name here in place of u_acl_testing

 

  choices.addQuery('element', 'u_city');                                               //Replace your backend Field Name here in place of u_city

 

  choices.addQuery('inactive', false);  

 

  choices.orderBy('sequence');  

 

  choices.query();  

 

  while (choices.next()) {  

 

      arr.push({  

 

          label:String(choices.label),  

 

          value:String(choices.value),  

 

          hint:String(choices.hint)  

 

      });  

 

  }  

 

  return JSON.stringify(arr);  

 

 

 

})();

 

 

 

 

 

find_real_file.png

 

 

 

find_real_file.png

 

 

 

So now once the above Detailed Description field is configured, if you check your Catalog Item form, it should have this Variable Detailed Description with the Choices and Hint Value present in that Variable in JSON Format as shown below:

 

 

 

find_real_file.png

 

 

 

4) Now create an On Load Catalog Client Script for that particular Catalog Item with the script as mentioned below:

 

 

 

Script:

 

 

 

function onLoad() {  

 

  var json = g_form.getValue('detail_Description');                                                                           // Multi Line Text Variable  

 

  var choiceList = JSON.parse(json);  

 

 

 

  g_form.clearOptions('city');                                                                                                                                               //Replace "city" with your Variable Name

 

 

 

  // Add the -- None -- option if needed, or set html to ''  

 

  var html = '<option value="" selected="selected">-- None --</option>';  

 

  var c;  

 

  // generate the html for the new choice list  

 

  for (var i = 0; i < choiceList.length; i++) {  

 

      c = choiceList[i];  

 

      html += '<option value="'+c.value+'" title="'+c.hint+'">'+c.label+'</option>';  

 

  }  

 

  g_form.getControl('city').innerHTML = html;                                                                                                               //Replace "city" with your Variable Name

 

  document.getElementById("city").style.backgroundColor = "red";                                   //Replace "city" with your Variable Name

 

}  

 

 

 

 

 

 

 

find_real_file.png

 

 

 

5) Now the final Step is to hide the Detailed Description Variable created, which can be done simply by using the Catalog UI Policy for that particular catalog Item. To Apply it on all three View Go to Advanced View of UI Policy and select Applies On Catalog View, Item and Task View.

 

 

 

Result:

 

 

 

find_real_file.png

 

Hope this helps.Mark the answer as correct/helpful based on impact.

 

Please Refer:

how to show the help text for choice value in service catalog variable

 

Let me know if you need more help.

 

Thanks,

Rajashekhar Mushke

Community Leader - 18



Thanks,
Rajashekhar Mushke
Rising star : 2022 - 2024
Community Leader -2018
Connect me on LinkedIn : Rajashekhar Mushke