Join the #BuildWithBuildAgent Challenge! Get recognized, earn exclusive swag, and inspire the ServiceNow Community with what you can build using Build Agent.  Join the Challenge.

GlideModal form on Service Portal

maryc
Tera Contributor

Hi,

 

I have a link on the Service Portal and I want to open a Glidemodal ( or a popup) window showing 2 reference fields and related fields on the form. On submit of the modla, it has to execute some logic and show an info message on the modal. How do I do that?

 

Thanks in advance

 

1 ACCEPTED SOLUTION

Community Alums
Not applicable

Hi @maryc ,

I tried to showing email in reference field 

<sn-record-picker field="location" table="'sys_user'"   display-field="'name'" display-field="'email'" value-field="'sys_id'" search-fields="'name'" page-size="100" ></sn-record-picker>

 

By doing this small change it shows email id you just need to change one parameter in sn-record-picker for email display-field="'email'" 

Result 

SarthakKashya2_0-1714371251293.png

 

Please mark my answer correct and helpful if this works for 

 

Thanks and Regards 

Sarthak

 

View solution in original post

16 REPLIES 16

Here is my code 

 

 

function ($scope, spUtil, $uibModal, $location, $timeout, spModal, spAriaUtil, $http, cabrillo, i18n) {
  /* widget controller  */
  var c = this;
 
$scope.openWin = function(){
    $scope.openModal('accesscatalog');
}
 
    // Adding next two functions to open and close modal - dms
    $scope.openModal = function(mdl) {
        $scope[mdl] = $uibModal.open({
            templateUrl: mdl,
            scope: $scope
        });
    };
   
    $scope.closeModal = function(mdl) {
        if ($scope[mdl]) {
            $scope[mdl].close();
        }
    };
 
}

 

 

 

<div>
<a id="myLink"  ng-click="openWin()">
            <div class="hero-icon-wrap btn-primary">
            
 <span class="hero-icon" role="button">Request Accessories</span>
            </div>
          </a>
          
       </div>
   
  <script type="text/ng-template" id="accesscatalog"> 
 <div class="modal fade" id="accesscatalog" tabindex="-1" role="dialog" aria-labelledby="accesscatalog" aria-hidden="true">
  <div class="modal-dialog" role="document">
    <div class="modal-content">
      <div class="modal-header">
        <h5 class="modal-title" id="accesscatalog">Modal title</h5>
        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
          <span aria-hidden="true">&times;</span>
        </button>
      </div>
      <div class="modal-body">
        Location
        <sn-record-picker field="location" table="'cmn_location'"   display-field="'name'" display-fields="'city,zip'" value-field="'sys_id'" search-fields="'name'" page-size="100" ></sn-record-picker>
        User
         <sn-record-picker field="location" table="'sys_user'"   display-field="'name'" display-fields="'city,zip'" value-field="'sys_id'" search-fields="'name'" page-size="100" ></sn-record-picker>
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
        <button type="button" class="btn btn-primary">Save changes</button>
      </div>
    </div>
  </div>
</div>  
</script>
 

SK Chand Basha
Tera Sage
Tera Sage

Hi @maryc 

 

This document might be helpful to achieve your requirement

https://developer.servicenow.com/dev.do#!/reference/api/utah/client/c_GlideModalClientSideV3API

 

Mark it helpfull and Accept Solution !! If this helps you to understand.