Editing button on form

[Asmita7]

Hello friends,

I am working on a requirement.

There is a already created "Verify". Previous functionality is when the record from "My" on page is selected and "Verify " is  then it will add "Verified" comment to "My" section on.  New Requirement is :

When the "Verify " is clicked, it should ask User to select one of three values :

1. Physically       2. Virtually          3. Verified 

When the user selects any of the three values then the selected value should also be added with comment.

ie. "Verified - Verified by Vendor".

I am not sure how to display 3 options to the User after clicking "Verify Details"  and then take input.

Please suggest.

Your efforts will be appreciated.

Thank you.

Asmita

[Community Alums · Accepted solution]

Hi @Asmita7 ,

To accomplish the above requirement you can use a modal dialog in ServiceNow's Service Portal, basically creating a modal widget to prompt the same.

Please try with below code-

create new widget with the below details-

Name: Verify Details Modal

ID: verify-details-modal

In the HTML Template

<div class="modal-header">
  <h4 class="modal-title">Select Verification Method</h4>
</div>
<div class="modal-body">
  <form>
    <div class="form-group">
      <label for="verificationMethod">Verification Method</label>
      <select class="form-control" id="verificationMethod" ng-model="c.data.verificationMethod">
        <option value="Physically verified">Physically Verified</option>
        <option value="Virtually Verified">Virtually Verified</option>
        <option value="Verified by vendor">Verified by Vendor</option>
      </select>
    </div>
  </form>
</div>
<div class="modal-footer">
  <button class="btn btn-primary" ng-click="c.submit()">Submit</button>
  <button class="btn btn-default" ng-click="c.close()">Cancel</button>
</div>

Client Script should be something like this-

function($scope, $rootScope) {
  var c = this;

  c.submit = function() {
    if (c.data.verificationMethod) {
      $rootScope.$broadcast('verify.details.submit', c.data.verificationMethod);
      c.close();
    }
  };

  c.close = function() {
    $rootScope.$broadcast('verify.details.close');
  };
}

 Now you need to update the existing widget which has the my details-

Over here you need to call the new widget that we created above-

  c.verifyDetails = function() {
    spModal.open({
      widget: 'verify-details-modal',
      size: 'md'
    });
  };

  $rootScope.$on('verify.details.submit', function(event, verificationMethod) {
    var comment = "Verified - " + verificationMethod;
    c.addComment(comment); // check the logic for this
  });

For the comments to update please check the logic to add it.

Note: You need to check the button function and the call the appropriate function (above we have verifyDetails() function)to execute the above.

If my response has resolved your query, please consider giving it a thumbs up ‌‌ and marking it as the correct answer‌‌!

Thanks & Regards,

Sanjay Kumar