THURSDAY, FEBRUARY 09, 2012

Show/Hide Service Catalog Variable Help Text

Tuesday, 02 February, 2010 07:42 Written by Mark Stanger
8 Comments

Each Service Catalog variable in ServiceNow allows you to provide the end-user with some additional information about that variable and how to use it. By default, these ‘Help Text’ sections are collapsed when the service catalog item loads. You may want to automatically expand the help text for a particular variable so that it is more obvious to the user what they need to do. Here’s how you can toggle the display of the help text for variables in your service catalog.



The following script will show the help text for the ‘caller_id’ variable automatically when the catalog item form loads.

function onLoad() {
   var myVar = g_form.getControl('caller_id');
   toggleHelp(myVar.id);
}
Note: There are some variable types (I’ve identified labels and multiple choice variables so far) that return an ID prefixed by ‘sys_original.’. For these variables, your script will have to replace that text in order to work correctly. Here’s an example for a multiple choice variable named ‘multichoice’.

function onLoad() {
   var myVar = g_form.getControl('multichoice');
   toggleHelp(myVar.id.replace('sys_original.', ''));
}


Switching help text open or closed instead of a toggle

If you encounter a situation where you need to open or close the help text automatically, but don’t know what state the help text will be in, then the ‘toggleHelp’ function probably won’t work for you. This is most often the case if you need to toggle the help text based on some ‘onChange’ event. For those cases you can use the following scripts, which leverage the ‘expand/collapse’ effect functionality I wrote about.

Expand the help text for a variable (‘caller_id’)

//Expand help text for a variable
var myVar = g_form.getControl('caller_id');
expandEffect($('help_' + myVar.id + '_wrapper'));
$('img.help_' + myVar.id + '_wrapper').src="images/filter_reveal16.gifx";

Collapse the help text for a variable (‘caller_id’)

//Collapse help text for a variable
var myVar = g_form.getControl('caller_id');
collapseEffect($('help_' + myVar.id + '_wrapper'));
$('img.help_' + myVar.id + '_wrapper').src="images/filter_hide16.gifx";
Tags:  ,
This entry was posted on Tuesday, February 2nd, 2010 at 7:42 am and is filed under Client scripts. You can follow any responses to this entry through the RSS 2.0 feed. You can leave a response, or trackback from your own site.

Comments

Posted On
Feb 17, 2010
Posted By
Alex

Works great.. Thanks!

Reply
Posted On
Mar 23, 2011
Posted By
Rox

Does anyone know how to format the help text box? I don’t want a continuous long line of text I want it to show in a list or perhaps bold some text, if anyone can help, that would be great. Thanks

Reply
Posted On
Mar 23, 2011
Posted By
Mark Stanger

Good question. The help text boxes can be formatted with straight html. You can insert line breaks, lists, etc. just by adding the correct html code. If you’re not an html expert you can use the html editor in a knowledge article to create the look you want and then copy the code :) .

Reply
Posted On
Apr 27, 2011
Posted By
Daniel Styer

Is there a way to tell the state of the Help field, On or Off. I would like to have the Help On when the field is blank. But, if the user toggles the Help, I can not tell what state the Help is in.

Reply
Posted On
Apr 27, 2011
Posted By
Mark Stanger

There is a way. I just updated the article with a method to do an expand or collapse rather than a simple toggle.

Reply
Posted On
Jun 21, 2011
Posted By
Amol

HI Mark,

I have created a Label field and add a help text there. this script is not working

Reply
Posted On
Jun 21, 2011
Posted By
Mark Stanger

Interesting. It looks like label fields have a different ID format than other variables do. It should work with this script…

function onLoad() {
   var myVar = g_form.getControl('YOUR_VAR_NAME_HERE');
   toggleHelp(myVar.id.replace('sys_original.', ''));
}
Reply
Posted On
Jun 21, 2011
Posted By
Amol

Many Many Many Thanks Mark.

It worked. Gr8. Here at client site and we were searching this for so many days.

Thanks a lot Again Mark.You are a true Guru of Service Now.

Thanks

Amol Bhatt

Patni Americas Inc.

Reply

Leave a Reply


Notify me of followup comments via e-mail. You can also subscribe without commenting.

Latest Comments

  • Aric: Finally figured out what I was doing wrong, incase someone else wants to do this. Mark is correct about needing...
  • Mark Stanger: You’ll probably need at least 3 total ACLs then. You’ll need one...
  • Mark Stanger: Hey Paul, I assume you’re talking about ‘task_ci’, not ‘task_group. If so, the...
  • ND: Hi Mark, This is cool. How can I do same at the form level. I have created a slushbucket variable and I want to...