How to make additional comments mandatory on Employee Center when reopen button is clicked?

JordyZ
Mega Sage

Hi,

 

In the Employee Center, is it possible to make additional comments mandatory when the user wants to reopen the incident once it's already been resolved?

JordyZ_0-1677598778057.png

So when the "reopen" button is clicked, a message should pop up saying the comments need to be filled in (and have the comments mandatory as well).

 

How do I go about doing this?

 

Thanks in advance.

1 ACCEPTED SOLUTION

Hi @JordyZ , Lemme share you all the code snippet i have

You can modify it accordingly to the field_names in your instance

 

HTML

<div>
  <div class="dropdown" id="child-case-tabs" ng-if="data.showActions">
    <button type="button" class="btn btn-default dropdown-toggle action-btn" data-toggle="dropdown" style="width : 100%">
      ${Actions}
      <span class="caret"></span>
    </button>
    <ul class="dropdown-menu" id="actionList">
      <li>
        <a ng-if="data.canResolve" href="javascript&colon;void(0)" ng-click="$event.stopPropagation();resolveIncident()">Resolve</a>
      </li>
      <li>
        <a ng-if="data.canReopen" href="javascript&colon;void(0)" ng-click="$event.stopPropagation();reopenIncident()">Reopen</a>
      </li>
      <li>
        <a ng-if="data.canClose" href="javascript&colon;void(0)" ng-click="$event.stopPropagation();closeIncident()">Close</a>
      </li>
    </ul>
  </div>


</div>

 

Server Script:

(function() {
    var incidentGr = new GlideRecord('incident');
    var incidentSysId = options.sys_id;

    if (!incidentSysId && $sp.getParameter('table') == 'incident')
        incidentSysId = $sp.getParameter('sys_id');

    if (!incidentSysId && $sp.getParameter('table') == 'universal_request') {
        var urGr = new GlideRecord('universal_request');
        urGr.get($sp.getParameter('sys_id'));
        incidentSysId = urGr.primary_task + "";
    }

    /* Actions - Start */
    if (input && input.action == 'resolve' && input.resolveComments!='' && incidentGr.get(incidentSysId)) {
        incidentGr.incident_state = global.IncidentState.RESOLVED;
        incidentGr.state = global.IncidentState.RESOLVED;
        incidentGr.resolved_by = gs.getUserID();
		incidentGr.close_notes = input.resolveComments;
		incidentGr.close_code="Closed/Resolved by Caller";
        incidentGr.update();
    }

    if (input && input.action == 'reopen' && input.reopenComments!='' && incidentGr.get(incidentSysId)) {
        incidentGr.incident_state = global.IncidentState.IN_PROGRESS;
        incidentGr.state = global.IncidentState.IN_PROGRESS;
        //incidentGr.assigned_to = '';

        incidentGr.comments = "Ticket reopened. \nReason for Reopen: "+'\n'+ input.reopenComments;
        incidentGr.update();
        // gs.addInfoMessage(gs.getMessage("Request reopened"));

    }


    if (input && input.action == 'closeIncident' && incidentGr.get(incidentSysId)) {
        incidentGr.incident_state = global.IncidentState.CLOSED;
        incidentGr.state = global.IncidentState.CLOSED;
        incidentGr.update();
    }

    /* Actions - End */

    /* Load incident data */
    if (incidentGr.get(incidentSysId)) {
        var incidentUtil = new global.IncidentUtils();
        data.canResolve = incidentUtil.canResolveIncidentPortal(incidentGr);
        data.canReopen = incidentUtil.canReopenIncident(incidentGr);
        data.canClose = incidentUtil.canCloseIncident(incidentGr);
        data.showActions = data.canResolve || data.canReopen || data.canClose;
    }

    data.i18n = {};

})();

Client Controller

function incidentTicketActions($scope, $http, spUtil, $timeout, spModal, i18n, $window, $uibModal) {
    /* widget controller */
    var c = this;
    c.doneLoading = false;

    var MOBILE_DEVICE_SCREEN_WIDTH = 767;
    $scope.mobileDevice = c.data.isMobile || ($window.innerWidth < MOBILE_DEVICE_SCREEN_WIDTH);


    c.Resolve = function(action) {
        c.data.action = action;
        c.server.update().then(function() {
            $scope.data.action = undefined;
            //spUtil.addInfoMessage("Incident has been resolved", 3000);

        });

    };
  
      $scope.closeIncident = function() {
        $scope.data.action = 'closeIncident';
        $scope.server.update(init);
    };

    $scope.$on('record.updated', function(name, data) {
        c.data.action == '';
        c.data.reopenComments = '';
        c.data.resolveComments= '';

        spUtil.update($scope);
    });

    c.Reopen = function(action) {
        c.data.action = action;
        c.server.update().then(function() {
            $scope.data.action = undefined;
            spUtil.addInfoMessage("Incident has been reopened", 3000);

        });

    };

    $scope.reopenIncident = function() {
        c.data.action = 'reopenIncident';
        c.modalInstance = $uibModal.open({
            templateUrl: 'modalTemplateReopen',
            scope: $scope
        });
        c.server.update(init);

    };

      $scope.resolveIncident = function() {
        $scope.data.action = 'resolveIncident';
        c.modalInstance = $uibModal.open({
            templateUrl: 'modalTemplateResolve',
            scope: $scope
        });
        c.server.update(init);
    };

    c.closeModal = function() {
        c.modalInstance.close();
    };

    function init() {}

    $(document).on('click', 'div.modal-footer button.btn, ul#child-case-tabs .dropdown-menu', function(e) {
        e.stopPropagation();
    });

    $(document).bind('dragover drop', function(event) {
        event.preventDefault();
        return false;
    });

    $scope.$on('sp_loading_indicator', function(e, value) {
        if (!value && !c.doneLoading) {
            c.doneLoading = true;
        }
    });

}


In my previous reply, I shared the code for "modaltemplate". Try this changes & let me know if it works for you

Thanks

Sails
ServiceNow Consultant
United Kingdom

View solution in original post

16 REPLIES 16

Thanks @Sails , I've changed the angular script name to the same as yours. In case you haven't seen the edit I made on the previous reply:

"In the server script I originally had 

if (input && input.action == 'reopenIncident' && input.reopenComments!='' && incidentGr.get(incidentSysId)) {

but changed the 'reopenIncident' (which is OOB) to just 'reopen', to match the script you've provided. However, now nothing happens when I click the reopen button (it doesn't even go through anymore)."

 

Even after changing the angular template name, the reopen still won't budge and no pop-up pops up. 

 

Current server script:

(function() {
    var incidentGr = new GlideRecord('incident');
    var incidentSysId = options.sys_id;

    if (!incidentSysId && $sp.getParameter('table') == 'incident')
        incidentSysId = $sp.getParameter('sys_id');

    if (!incidentSysId && $sp.getParameter('table') == 'universal_request') {
        var urGr = new GlideRecord('universal_request');
        urGr.get($sp.getParameter('sys_id'));
        incidentSysId = urGr.primary_task + "";
    }

    /* Actions - Start */
    if (input && input.action == 'resolveIncident' && incidentGr.get(incidentSysId)) {
        incidentGr.incident_state = global.IncidentState.RESOLVED;
        incidentGr.state = global.IncidentState.RESOLVED;
        incidentGr.resolved_by = gs.getUserID();
        data.isIncidentResolved = incidentGr.update();
    }

     if (input && input.action == 'reopen' && input.reopenComments!='' && incidentGr.get(incidentSysId)) {
        incidentGr.incident_state = global.IncidentState.IN_PROGRESS;
        incidentGr.state = global.IncidentState.IN_PROGRESS;
        //incidentGr.assigned_to = '';

        incidentGr.comments = "Ticket reopened. \nReason for Reopen: "+'\n'+ input.reopenComments;
        incidentGr.update();
        // gs.addInfoMessage(gs.getMessage("Request reopened"));

    }

    if (input && input.action == 'closeIncident' && incidentGr.get(incidentSysId)) {
        incidentGr.incident_state = global.IncidentState.CLOSED;
        incidentGr.state = global.IncidentState.CLOSED;
        data.isIncidentClosed = incidentGr.update();
    }

    /* Actions - End */

    /* Load incident data */
    if (incidentGr.get(incidentSysId)) {
        var incidentUtils = new global.IncidentUtils();
        data.canResolve = incidentUtils.canResolveIncident(incidentGr);
        data.canReopen = incidentUtils.canReopenIncident(incidentGr);
        data.canClose = incidentUtils.canCloseIncident(incidentGr);
        data.showActions = data.canResolve || data.canReopen || data.canClose;
    }

    data.i18n = {};

})();

Current client controller:

function incidentTicketActions($scope, $http, spUtil, $timeout, spModal, i18n, $window, $uibModal, spAriaUtil) {
    /* widget controller */
    var c = this;
    c.doneLoading = false;
    c.resolvedIncidentMsg = "${Resolved Incident}";
    c.closedIncidentMsg = "${Closed Incident}";
    c.reopenedIncidentMsg = "${Reopened Incident}";
    c.Reopen = function(action) {
        c.data.action = action;
        c.server.update().then(function() {
            $scope.data.action = undefined;
            spUtil.addInfoMessage("Incident has been reopened", 3000);

        });

    };

    $scope.reopenIncident = function() {
        c.data.action = 'reopenIncident';
        c.modalInstance = $uibModal.open({
            templateUrl: 'modalTemplateReopen',
            scope: $scope
        });
        c.server.update(init);

    };
    var MOBILE_DEVICE_SCREEN_WIDTH = 767;
    $scope.mobileDevice = c.data.isMobile || ($window.innerWidth < MOBILE_DEVICE_SCREEN_WIDTH);

    $scope.resolveIncident = function() {
        $scope.data.action = 'resolveIncident';
        $scope.server.update(init).then(function(response) {
            if (response.isIncidentResolved)
                spAriaUtil.sendLiveMessage(c.resolvedIncidentMsg);
        });
        $scope.$emit('focusOnActions', {
            "isFocusRequired": true
        });
    };

    $scope.closeIncident = function() {
        $scope.data.action = 'closeIncident';
        $scope.server.update(init).then(function(response) {
            if (response.isIncidentClosed)
                spAriaUtil.sendLiveMessage(c.closedIncidentMsg);
        });
        var elm = document.getElementById('short-desc')
        elm.focus();
    };

    $scope.reopenIncident = function() {
        $scope.data.action = 'reopenIncident';
        $scope.server.update(init).then(function(response) {
            if (response.isIncidentReopened)
                spAriaUtil.sendLiveMessage(c.reopenedIncidentMsg);
        });
        $scope.$emit('focusOnActions', {
            "isFocusRequired": true
        });
    };

    function init() {}

    $(document).on('click', 'div.modal-footer button.btn, ul#child-case-tabs .dropdown-menu', function(e) {
        e.stopPropagation();
    });

    $(document).bind('dragover drop', function(event) {
        event.preventDefault();
        return false;
    });

    $scope.$on('sp_loading_indicator', function(e, value) {
        if (!value && !c.doneLoading) {
            c.doneLoading = true;
        }
    });
}

 Angular template name: modalTemplateReopen

 

Thanks in advance.

Hi @JordyZ , Lemme share you all the code snippet i have

You can modify it accordingly to the field_names in your instance

 

HTML

<div>
  <div class="dropdown" id="child-case-tabs" ng-if="data.showActions">
    <button type="button" class="btn btn-default dropdown-toggle action-btn" data-toggle="dropdown" style="width : 100%">
      ${Actions}
      <span class="caret"></span>
    </button>
    <ul class="dropdown-menu" id="actionList">
      <li>
        <a ng-if="data.canResolve" href="javascript&colon;void(0)" ng-click="$event.stopPropagation();resolveIncident()">Resolve</a>
      </li>
      <li>
        <a ng-if="data.canReopen" href="javascript&colon;void(0)" ng-click="$event.stopPropagation();reopenIncident()">Reopen</a>
      </li>
      <li>
        <a ng-if="data.canClose" href="javascript&colon;void(0)" ng-click="$event.stopPropagation();closeIncident()">Close</a>
      </li>
    </ul>
  </div>


</div>

 

Server Script:

(function() {
    var incidentGr = new GlideRecord('incident');
    var incidentSysId = options.sys_id;

    if (!incidentSysId && $sp.getParameter('table') == 'incident')
        incidentSysId = $sp.getParameter('sys_id');

    if (!incidentSysId && $sp.getParameter('table') == 'universal_request') {
        var urGr = new GlideRecord('universal_request');
        urGr.get($sp.getParameter('sys_id'));
        incidentSysId = urGr.primary_task + "";
    }

    /* Actions - Start */
    if (input && input.action == 'resolve' && input.resolveComments!='' && incidentGr.get(incidentSysId)) {
        incidentGr.incident_state = global.IncidentState.RESOLVED;
        incidentGr.state = global.IncidentState.RESOLVED;
        incidentGr.resolved_by = gs.getUserID();
		incidentGr.close_notes = input.resolveComments;
		incidentGr.close_code="Closed/Resolved by Caller";
        incidentGr.update();
    }

    if (input && input.action == 'reopen' && input.reopenComments!='' && incidentGr.get(incidentSysId)) {
        incidentGr.incident_state = global.IncidentState.IN_PROGRESS;
        incidentGr.state = global.IncidentState.IN_PROGRESS;
        //incidentGr.assigned_to = '';

        incidentGr.comments = "Ticket reopened. \nReason for Reopen: "+'\n'+ input.reopenComments;
        incidentGr.update();
        // gs.addInfoMessage(gs.getMessage("Request reopened"));

    }


    if (input && input.action == 'closeIncident' && incidentGr.get(incidentSysId)) {
        incidentGr.incident_state = global.IncidentState.CLOSED;
        incidentGr.state = global.IncidentState.CLOSED;
        incidentGr.update();
    }

    /* Actions - End */

    /* Load incident data */
    if (incidentGr.get(incidentSysId)) {
        var incidentUtil = new global.IncidentUtils();
        data.canResolve = incidentUtil.canResolveIncidentPortal(incidentGr);
        data.canReopen = incidentUtil.canReopenIncident(incidentGr);
        data.canClose = incidentUtil.canCloseIncident(incidentGr);
        data.showActions = data.canResolve || data.canReopen || data.canClose;
    }

    data.i18n = {};

})();

Client Controller

function incidentTicketActions($scope, $http, spUtil, $timeout, spModal, i18n, $window, $uibModal) {
    /* widget controller */
    var c = this;
    c.doneLoading = false;

    var MOBILE_DEVICE_SCREEN_WIDTH = 767;
    $scope.mobileDevice = c.data.isMobile || ($window.innerWidth < MOBILE_DEVICE_SCREEN_WIDTH);


    c.Resolve = function(action) {
        c.data.action = action;
        c.server.update().then(function() {
            $scope.data.action = undefined;
            //spUtil.addInfoMessage("Incident has been resolved", 3000);

        });

    };
  
      $scope.closeIncident = function() {
        $scope.data.action = 'closeIncident';
        $scope.server.update(init);
    };

    $scope.$on('record.updated', function(name, data) {
        c.data.action == '';
        c.data.reopenComments = '';
        c.data.resolveComments= '';

        spUtil.update($scope);
    });

    c.Reopen = function(action) {
        c.data.action = action;
        c.server.update().then(function() {
            $scope.data.action = undefined;
            spUtil.addInfoMessage("Incident has been reopened", 3000);

        });

    };

    $scope.reopenIncident = function() {
        c.data.action = 'reopenIncident';
        c.modalInstance = $uibModal.open({
            templateUrl: 'modalTemplateReopen',
            scope: $scope
        });
        c.server.update(init);

    };

      $scope.resolveIncident = function() {
        $scope.data.action = 'resolveIncident';
        c.modalInstance = $uibModal.open({
            templateUrl: 'modalTemplateResolve',
            scope: $scope
        });
        c.server.update(init);
    };

    c.closeModal = function() {
        c.modalInstance.close();
    };

    function init() {}

    $(document).on('click', 'div.modal-footer button.btn, ul#child-case-tabs .dropdown-menu', function(e) {
        e.stopPropagation();
    });

    $(document).bind('dragover drop', function(event) {
        event.preventDefault();
        return false;
    });

    $scope.$on('sp_loading_indicator', function(e, value) {
        if (!value && !c.doneLoading) {
            c.doneLoading = true;
        }
    });

}


In my previous reply, I shared the code for "modaltemplate". Try this changes & let me know if it works for you

Thanks

Sails
ServiceNow Consultant
United Kingdom

It works @Sails !!! I've used your client controller and replaced the angular template for resolve part with the OOB snippet . I can see the pop-up now. Thanks for helping me out and being so patient.

Thank you @JordyZ 

Sails
ServiceNow Consultant
United Kingdom

Hello,

Wow...well, there's been all sorts of replies here that I don't even know where to assist at this point.

Anyways, it was hopeful that my original reply was Helpful and guided you as appropriate as it pointed to similar discussion doing exactly what you were wanting to do. If there's anything else I can do to assist, please let me know, but it seems you've got some momentum going with someone else.

Thanks!


Please consider marking my reply as Helpful and/or Accept Solution, if applicable. Thanks!