Hi there,

While working on the Service Portal, I noticed that the Submit button on the SC Catalog Item widget acts a bit confusing. Confusing as: 1) First it's clickable with label "Submit"2) On click it turns not clickable with label "Submit" plus next to the button a text "Submitting..."3) And once submitted the button is not clickable with label... "Submit"?!

The out-of-the-box UX:

We could do better! To enhance the UX, I digged into the Widget code and altered it slightly.

First, the enhanced UX:

Note: Tested with Catalog Item and Record Producers that have Request Method "Submit", and the SC Catalog Item instance options having Auto redirect after submission turned off

So what do we need to change to the SC Catalog Item widget to achieve this?

1) Clone the SC Catalog Item widget and tie the cloned widget to the Service Catalog (sc_cat_item) page.2) Modify the Body HTML template, Server script, and Client controller:

Body HTML template

--- Replace all {{::submitButtonMsg}} with {{submitButtonMsg}}
--- Remove all ${Submitting...}

Server script

--- Within the var m = data.msgs = {}; section (line 92), add m.submittingMsg = gs.getMessage('Submitting...');, and add m.submittedMsg = gs.getMessage('Submitted');

Client controller

--- Within function getOne() (line 419), add $scope.submitButtonMsg = $scope.m.submittingMsg; (for example on line 420)



--- In the same function, within add $scope.submitButtonMsg = $scope.m.submittedMsg; (in my case line 507, which is within the else of if ($scope.data.is_wishlist_item) and within if (c.options.auto_redirect == 'false'))

---

And that's it actually. Hope you like it. If any questions or remarks, let me know!

	If this post helped you in any way, I would appreciate it if you hit bookmark or mark it as helpful.Interested in more articles, blogs, videos, and Share projects on Service Portal I published?- Service Portal

Kind regards,Mark

2020 ServiceNow Community MVP

2020 ServiceNow Developer MVP

---

LinkedIn