How can I add a Cancel button on Service Portal ?

[gmorales]

Hello Guys,

I got a requirement to add a cancel button to cancel the actual order and redirec to home page... However I thought they were using CMS, I've noticed that there is a Plug in called "Service Portal" and it builds a complete site... this is completely new for me I've started to play with this but is completely different I've tried this (https://serviceportal.io/create-custom-action-buttons-service-portal/) but there is no instructions on how to add it to a specific page or form. Need Help ASAP, I couldn't find a documentation or clear examples of this.

Thanks!

[stefan_ojeblom]

Hey gmorales,

I actually took a look at the serviceport.io page and took their example to work on buttons on the new Portal ticket page. Based on that I might be able to help you out a bit..

This is what my HTML section looks like;

(It is a new widget that has to be placed on the proper page in the Page editor...)

Hope that helps you out a little bit.

<!!div ng-show="c.data.showActions"-->
<div class="panel panel-default">
 <div class="panel-heading">Actions</div>
 <div class="panel-body">
     <!--div ng-show="showResolve"-->
   <button ng-if="c.data.showResolve" type="button" class="btn btn-primary btn-block" ng-click="c.uiAction('resolve')">Resolve Incident</button>
   <button ng-if="c.data.showReopen" type="button" class="btn btn-primary btn-block" ng-click="c.uiAction('reopen')">Reopen Incident</button> 
   <button ng-if="c.data.showCancel" type="button" class="btn btn-primary btn-block" ng-click="c.uiAction('cancel')">Cancel Incident</button> 
   <button ng-if="c.data.showClose" type="button" class="btn btn-primary btn-block" ng-click="c.uiAction('close')">Close Incident</button> 
   <button ng-if="c.data.showNoAction" type="button" class="btn btn-primary btn-block" ng-click="c.uiAction('noAction')">No Actions Available</button> 
 </div>
</div>

And this is the server side script;

(function() {

   data.showNoAction = true;
   data.showResolve = false;
   data.showReopen = false;
   data.showCancel = false;
   data.showClose = false;

   // Get table & sys_id
   data.table = input.table || $sp.getParameter("table");
   data.sys_id = input.sys_id || $sp.getParameter("sys_id");

   // Valid GlideRecord
   var gr = new GlideRecord(data.table);
   if (!gr.isValid())
   return;

   // Valid sys_id
   if (!gr.get(data.sys_id))
   return;

   var closed = IncidentState.CLOSED;
   var canceled = IncidentState.CANCELED;
   var resolved = IncidentState.RESOLVED;
   var newState = IncidentState.NEW;
   var on_hold = IncidentState.ON_HOLD;
   var awaiting_caller = IncidentReason.AWAITING_CALLER;
   var active = gr.active;
   var state = gr.getValue('state');
   var reason = gr.getValue('hold_reason');

   if (state == resolved) {
   data.showReopen = true;
   data.showClose = true;
   data.showNoAction = false;
   }

   if (state == newState || state == on_hold && reason == awaiting_caller) {
   data.showResolve = true;
   data.showCancel = true;
   data.showNoAction = false;
   }

   if (input && input.action) {
   var action = input.action;

   // If Incident table
   if (data.table == 'incident') {

   if (action == 'resolve') {
   // Resolve Incident
   gr.setValue('incident_state', resolved);
   gr.setValue('state', resolved);
   gr.setValue('resolved_by', gs.getUserID());
   gr.update();
   }

   if (action == 'reopen') {
   // Reopen Incident
   gr.setValue('incident_state', newState);
   gr.setValue('state', newState);
   gr.update();
   }

   if (action == 'close') {
   // Close Incident
   gr.setValue('incident_state', closed);
   gr.setValue('state', closed);
   gr.update();
   }

   if (action == 'cancel') {
   // Cancel Incident
   gr.setValue('incident_state', canceled);
   gr.setValue('state', canceled);
   gr.update();
   }
   }
   }

})();

[gmorales]

Thanks, I'm pretty sure that the logic of the script is ok once a button is clicked.

But where I set the button to be placed on a specific table, eg. sc_cat_item? I need to put a cancel button at the Catalog Item form . next to the blue "submit" button

[stefan_ojeblom · Accepted solution]

Go here;

Then go here;

Click the "Edit Ticket Form (ticket) page in Designer

Then Drag&Drop your new widget into the page where you want it!

[stefan_ojeblom]

Just as an example to help you out of course...