How to populate the glidedialog window on service portal

[Dhodda Nagasre1]

Hello All,

We have a requirement to populate the dialog window on service portal where we need to show accept check box along with ok ad cancel button.

If user click 'ok' button it should load catalog item.

If user clicks 'cancel' button the page should navigate to home page.

I have tried using GlideModal and GlideDialogWindow method to populate but it working in backend and but not supporting on service portal

Below is the sample similar box we need to populate on service portal.

Can anyone have idea how to achieve it ? 

[Ankur Bawiskar]

@Dhodda Nagasre1 

yes GlideModal and GlideDialogWindow won't work on portal

you can try to use spModal.open

also check these links

Modal Windows in Service Portal 

If my response helped please mark it correct and close the thread so that it benefits future readers.

[Ankur Bawiskar]

@Dhodda Nagasre1 

Did you get a chance to see the above link?

[Dhodda Nagasre1]

Hi Ankur,

Thank  you for your help.

I was able to create the popup window on service portal using spModal.open using onload client script.

But will not able to show check box on popup window.

Thanks.

[Nishita Padwal]

Hello @Dhodda Nagasre1 -

Let me know if you find this sample example helpful. -

Sample client controller -

function($uibModal, $scope) {
   var c = this;
      c.openModal = function() {
      c.modalInstance = $uibModal.open({
      templateUrl: 'modalTemplate',
      scope: $scope
   });
 }

 c.okayModal = function() {
   var okayURL = 'https://www.abc.com'; //ADD THE CATALOG ITEM URL HERE
   window.open(okayURL, '_blank');
 }

 c.cancelModal = function() {
    var cancelURL = 'https://www.xyz.com'; // ADD THE HOME-PAGE URL HERE
   window.open(cancelURL, '_blank');
 }
 
}

Sample HTML code -

The 'Open Modal' button here is the trigger action to open the dialog window.

<div>
 <button class="btn btn-primary" ng-click="c.openModal()">${Open Modal}</button>
</div>
 
<script type="text/ng-template" id="modalTemplate">
 <div class="panel panel-default">
 <div class="panel-heading">
 <h4 class="panel-title"> Title of the Window </h4>
   </div>
 <div class="panel-body wrapper-xl">
 Hello
   </div>
 <div class="panel-footer text-right">
 <button class="btn btn-primary" ng-click="c.okayModal()">${Okay}</button>
 <button class="btn btn-primary" ng-click="c.cancelModal()">${Cancel}</button>
 </div>
 </div>
</script>

If my response helped please mark it as correct!

Thanks!