ServiceNow Widget – URL Parameter

ServiceNow URL Parameter

ServiceNow Widget is what define the content in your portal. You can use the base system widgets provided with Service Portal, clone and modify widgets, or develop custom widgets to fit your own needs.

ServiceNow Widget – Catalog Home Page Widget

Today, we are going to add a simple custom widget which contains the Image background and the dynamic catalog Title and Description based on user selection of which catalog.

ServiceNow Widget

HOW CAN WE ACHIEVE THIS REQUIREMENT

  • Step 1: Clone the Homepage search widget
image 8
  • Step 2: Modify the content as below

HTML Template

<div id="homepage-search" class="hidden-xs wrapper-xl">
  <div class="wrapper-xl">
  	<h2 class="text-center text-4x m-b-lg sp-tagline-color" ng-bind="data.title"></h2>
  	<div ng-if="data.description" class="text-center h4 m-b-lg sp-tagline-color" ng-bind="data.description"></div>
  	
  </div>
</div>

Server Script

(function() {
	
	data.catalogId = $sp.getParameter('catalog_id') || -1;
	
	if (data.catalogId == -1) { // All is selected
		data.title = "Request Form";
		data.description = "Here is the description when select ALl";
	} else {
		data.title = getCatalogFieldValue(data.catalogId,'title');
		data.description = getCatalogFieldValue(data.catalogId,'description');
	}

	
	function getCatalogFieldValue(catalogId,field) {
		var gr = new GlideRecord('sc_catalog');
		if (gr.get(catalogId)) {
			return gr.getValue(field);
		}
	}


})();
  • Step 3: Include the widget to Page and add Image to Container
image 9
image 10

Result

When All is selected or page is loaded first time

image 13

When we select other catalogs

image 12