Enabling "submit" button on sc_catalog_item widget

Shillu
Kilo Guru

I am working on a requirement for service catalog on service portal. The sc_catalog_item widget is cloned and customized. The customization applied to that widget is for "disabling" the OrderNow/submit button under certain conditions.

The sc_cat_item page also has an embedded macro widget. This macro widget has a checkbox in it. When the form renders and the conditions are met for "disabling" of the "submit" button, the user should be able to click the check box inside the embedded macro widget and the "submit" button will be "enabled". I need help with this part.I am looking into the inter-widget communication concept to achieve this. Is that the right direction? Any suggestions or ideas will be appreciated.

Thank you!

 

8 REPLIES 8

Kristoffer Mon1
Giga Expert

This inter-widget communication can open up new and exciting Service Portal possibilities. So from the example from this link: https://serviceportal.io/using-events-communicate-widgets/

You'll need to setup your widget client scripts to broadcast and listen for events. For example, a widget embedded into a catalog item can broadcast a "disable submit button event" that the embedded widget, in the sc_cat_item page, then responds to that event to disable the submit button.

SatheeshKumar
Kilo Sage

Widget 1 Client Script

function ($rootScope) {
   $rootScope.$broadcast(‘incident.changed’, {});
}

Widget 2 Client Script

function ($scope) {
   $scope.$on(‘incident.changed’,
       function(event, data) {
           // Do something!
       });
}

Shillu
Kilo Guru

While rendering the form, disabling of the submit button is done using the following HTML & Client Script.

This is in the sc_catalog_item widget.

HTML

find_real_file.png

c.disableOrderNow() returns the decision to disable the submit button.

Client Controller Script

find_real_file.png

find_real_file.png

What I have available is the embedded macro widget is below:

HTML Template

find_real_file.pngfind_real_file.png

My questions are:

Should I use $rootScope.emit/$rootScope.broadcast the broadcast of the event is from an embedded widget.

How will I set the ng-disabled to receive the right value to enable the submit button.

 

Appreciate any assistance.

Thank you!

 

Shillu
Kilo Guru