Using widgets in catalog items and displaying info from a record

[Rick Mann]

Hello Everyone

I'm working on building a simple widget I can use in a catalog item to display information from a software model record.   I've put together something that works, but seems highly inefficient.   Is it possible to use a widget client script to get a value from a catalog item and to then query a CMDB record?

Background:   We have a catalog item where people can request software, which has a lookup list that references records in our Software Model table (cmdb_software_product_model).   We want to have a way to display "more detail/special instructions" about individual models. I added an HTML field to our Software Model table called Special Instructions where our Asset Manager can create shorts notes about the product. If a requester selects a software product that has Special Instructions, then I want those instructions to display on the catalog item.

Using this article as a guide Embedding widgets in Service Catalog - ServicePortal.io - Service Portal, CMS, and Custom Apps I created a multi-line text variable in my catalog item to store the contents of any instructions from the selected model.   I use a catalog client script to query the selected software model and set a value in my catalog variable.

function onChange(control, oldValue, newValue, isLoading) {
   if (newValue == '') {
   return;
   }
   if (newValue != ''){
   var jp = new GlideRecord('cmdb_software_product_model');
   jp.addQuery('sys_id', newValue);
   jp.query(doAlert);
   }
}
function doAlert(jp){
   while (jp.next()){
   g_form.setValue('si', jp.u_special_instructions);
   }
}

Next I created a widget that gets the value from my catalog variable and pushes the HTML into the HTML Template.

Finally, I have a Macro variable on my catalog item that uses the new widget.   All of this works, but I'm looking for a better way to complete the query and display my results.

Thank you!

Rick Mann

[Gurpreet07]

Hi Rick,

So what is the issue with this implementation. If you are getting HTML tags in portal then you probable need to use ng-bind-html in widget.

<div>

<h3>Special Instructions</h3>

<div ng-bind-html="c.data.results" id="newstuff"></div>

</div>

Also you could directly set the innerHTML for above div from your client script.

1. function doAlert(jp){  
2.   while (jp.next()){  
3.   //g_form.setValue('si', jp.u_special_instructions);  
4. document.getElementById('newstuff').innerHTML=jp.u_special_instructions;
5.   }  

[Rick Mann]

Gurpreet - Thx for the reply.   I've been re-working my widget client script and I'm able to get the sysID of the software model I want to lookup (sw_pkg variable) and display it in the console.   However, I'm not able to pass it into the server script in order to do a gliderecord query.   I thought "c.server.update()" should do the trick, but no success.   Any thoughts?

function($scope,$rootScope,spUtil) {

  var c = this;

  //c.data.results = "Test this out.";

  $rootScope.$on("field.change", function(evt, parms) {

  /*if (parms.field.variable_name == 'si') {

  c.data.si = parms.newValue;

  var obj = document.getElementById('newstuff');

  obj.innerHTML = c.data.si;

  }*/

  if (parms.field.variable_name == 'sw_pkg') {

  c.data.sw_pkg = parms.newValue;

  console.log(c.data.sw_pkg);

  //spUtil.update($scope);

  c.server.update();

  }

  //c.data.results = c.data.sw_pkg;

  var obj2 = document.getElementById('newstuff2');

  obj2.innerHTML = c.data.sp_inst;

  });

}

[Gurpreet07]

Hi Rick,

It requires to define some parameters in client controller and also in server code.Search in widgets for client controller contains server.update() and you will get some of the widgets. Have a look at approval widget.

[Daniel Voutt]

Hi,

Did you ever get this working?   I need to do something similar in change requests and want to display data such as approvers and change implementors based on service selected previously.

Thanks in advance,

Dan