UI Macro in ServiceNow

Definition

ServiceNow is well known for the rich user/developer friendly experience it provides to the customers. It associates its complex process and functional execution with the rich reusable library of objects it offers with even its venial version. With the simple drag and drop, ServiceNow enables developer to avail complex configurations with spot on performances. It also enables developers to develop required customizations with ease by incorporating intelligent scripting. It is often required by the customers to have a customized look feel and process orientation in ServiceNow development. UI Macro is a go to object for the cases as such.

Purpose of UI Macro

• UI macros are basically used to create one’s own custom controls and interfaces. Administrator can create UI Macros.
• For creating UI Macros, knowledge of jelly scripting is required.
• By default, ServiceNow provides UI Macros for various user interfaces like:
  • All formatters
  • Service catalog cart
  • Action icon next to field
  • Action icons on form and lists.

How to create UI Macros

For creating UI Macros, one requires the knowledge of jelly scripting. In order to create the UI Macros in ServiceNow navigate through   System UI >> UI Macros >>New.

During creation of UI Macro, one has to provide unique name, description as why this UI Macro has been created and XML section where in one can write the script based on requirement.

Calling UI Macros

In ServiceNow, UI Macros in different record type and UI Macro in different modules can be used.

–  One can use UI Macro to display icon for the reference field:-

After creating UI Macro, to invoke it one needs to add the same in the attribute field of field dictionary.

1. Right click on the caller field and click on the Dictionary.
   
2. In the attribute field call the UI Macro.
   

   To call UI Macro :-

   ref_contributions = UI Macro_name

   –  Using UI Macro in UI pages:-

        To add icons, separators (line), images etc. in UI page one can use UI Macro.

   Following is the example that depicts the use of UI Macro in UI Page.

   The yellow line shown in below screenshot is UI Macro

   

   Steps to follow

   In the UI Page, one can invoke the UI Macro by using the following highlighted code in the HTML script.

   

   To call UI Macro :-

   – One can call UI Macro from the server side scripts like business rule, script include.

   The green line in the following figure appears by means of the UI macro that has been invoked from the business rule on the incident table using addInfoMessage() method of the glide system API.

   

1. One can call UI Macro from the business rule and script include using following code.
   Using UI Macro in service catalog variables.One can use the UI Macro in the service catalog variables to create different UI. One can create his own interface and according to requirement use the UI Macro.Following example shows how to use UI Macro in catalog variable and how it looks.

1. Create the variable in catalog item and select type of variable as macro or macro with label.
   
2. Select the macro in macro reference field. We are pretty sure that this blog must have given a practical insight to UI Macros. Any comments\suggestions are most welcome. We have posted further blogs as well on other topics and will frequently come back with something innovative.