Service Portal: Catalog Item Buttons

Example buttons for Service Catalog items in the Service Portal. 

Use a button in a catalog item to:

• Set fields Visible
• Set fields mandatory
• Change the label of a field
• Set a field read only
• Change the value of a field
• Anything you can do in a client script

View fullsize

Clicking the buttons to make the example field change

CODE

You would embed this widget in your catalog item as a variable with the type of UI Macro.  You would need to change the code as needed of course.  This is just an example to get you started.

Variables FOR YOUR CATALOG ITEM

UI Macro
Question: Service Catalog Buttons
Name: service_catalog_buttons
Widget: Service Catalog Buttons

Single Line Text
Question: Example Field
Name: example_field

Widget

Name: Service Catalog Buttons

HTML

<div class="panel panel-default">
<div class="panel-heading">Actions</div>
<div class="panel-body">
<button type="button" class="btn btn-primary btn-block" ng-click="c.setFieldVisible()">Visible</button>
<button type="button" class="btn btn-success btn-block" ng-click="c.setFieldMandatory()">Mandatory</button>
<button type="button" class="btn btn-info btn-block" ng-click="c.setFieldLabel()">Label</button>
<button type="button" class="btn btn-warning btn-block" ng-click="c.setFieldReadOnly()">Read only</button>
<button type="button" class="btn btn-danger btn-block" ng-click="c.setFieldValue()">Value</button>
</div>
</div>

Client Controller

function($scope) {
var c = this;
c.setFieldVisible = function() {
var g_form = $scope.page.g_form;
if (g_form.isVisible('example_field') == false) {
g_form.setDisplay('example_field', true);
}
else {
g_form.setDisplay('example_field', false);
}
},
c.setFieldMandatory = function() {
var g_form = $scope.page.g_form;
if (g_form.isMandatory('example_field') == false) {
g_form.setMandatory('example_field', true);
}
else {
g_form.setMandatory('example_field', false);
}
},
c.setFieldReadOnly = function() {
var g_form = $scope.page.g_form;
if (g_form.isReadOnly('example_field') == false) {
g_form.setReadOnly('example_field', true);
}
else {
g_form.setReadOnly('example_field', false);
}
}, 
c.setFieldLabel = function() {
var g_form = $scope.page.g_form;
if (g_form.getLabelOf('example_field') == 'Example Field') {
g_form.setLabelOf('example_field', 'ServiceNow Elite');
}
else {
g_form.setLabelOf('example_field', 'Example Field');
}
},
c.setFieldValue = function() {
var g_form = $scope.page.g_form;
if (g_form.getValue('example_field') == '') {
g_form.setValue('example_field', 'Mike Kaufman');
}
else {
g_form.setValue('example_field', '');
}
}
}