Willem
Giga Sage
Giga Sage

Display terms and conditions on Login

[Work in Progress] Please add any ideas and comments.

 

It was build long ago by ServiceNow Guru: a popup that appears after login in.

Since the files from servicenow guru are not available. I decided to build similar functionality myself.

 

We will reuse the UI Page, as that code is still available:

UI Page: ‘terms_and_conditions_dialog’

HTML

<g:ui_form>
   <!-- Get values from dialog preferences passed in -->
   <g:evaluate var="jvar_cancel_url"
     expression= "RP.getWindowProperties().get('cancel_url')" />
   <input type="hidden" id="cancel_url" value="${jvar_cancel_url}" />
   <table width="100%">
     <tr>
       <td>
          <div style="width:584px; height:400px; overflow:auto; border: 1px solid gray;">
             ENTER YOUR TERMS HERE...
          </div>
       </td>
     </tr>
     <tr>
       <td>
         <div style="margin-top: 10px;">
           <!-- Pull in 'ui_checkbox' UI Macro for accept checkbox -->
           <g:ui_checkbox id="accept_terms" name="accept_terms" value="false"/>
           <label for="load_demo">I accept these terms and conditions.</label>  
         </div>
       </td>
     </tr>
     <tr>
       <td colspan="2">
       </td>
     </tr>
     <tr id="dialog_buttons">
        <td colspan="2" align="right">
           <!-- Pull in 'dialog_buttons_ok_cancel' UI Macro for submit/cancel buttons -->
           <g:dialog_buttons_ok_cancel ok="return termsOK()" cancel="termsCancel()" ok_type="button" cancel_type="button"/>
        </td>
     </tr>
  </table>
</g:ui_form>

Client script

function termsOK(){
   //Gets called if the 'OK' dialog button is clicked
   //Make sure terms have been accepted
   var terms = gel('accept_terms').value;
   if(terms != 'true'){
      //If terms are false stop submission
      alert('Please accept the terms and conditions to continue your order.');
      return false;
   }
   //If accept checkbox is true do this...
   GlideDialogWindow.get().destroy(); //Close the dialog window
   //g_form.setValue('myvar', true); //Optionally set the value of a variable or field indicating acceptance
}

function termsCancel(){
   //Redirect gets called if the 'Cancel' dialog button is clicked
   if($('cancel_url').value != 'null'){
      window.location = $('cancel_url').value;
   }
   else{
      window.location = 'home.do'; //Redirect to default homepage
   }
}

 

In order for this to show up we have to create a UI Script and a Client callable Script include:

UI Script: 'showTermsOnLogin'

addLoadEvent(function () {
    if ((window.name !== 'gsft_main') || (window.parent.document.URL.indexOf("login.do") > -1)) {
        console.log("Prevent popup in this window or on this page.");
        return;
    }

    var ga = new GlideAjax('global.sessionUtil');
    ga.addParam('sysparm_name', 'handleSession');
    ga.getXML(function (serverResponse) {
        var answer = serverResponse.responseXML.documentElement.getAttribute("answer");
        if(answer == 'true'){
            showTerms();
        }
    });
});

var showTerms = function () {
    var dialog = new GlideDialogWindow('terms_and_conditions_dialog'); //Render the dialog containing the UI Page 'terms_and_conditions_dialog'
    dialog.setTitle('Terms and Conditions'); //Set the dialog title
    dialog.setSize(600, 600); //Set the dialog size
    dialog.removeCloseDecoration(); //Remove the dialog close icon
    dialog.setPreference('cancel_url', 'catalog_home.do?sysparm_view=catalog_default'); //Set optional cancel redirect URL
    dialog.render(); //Open the dialog
}

 

Script Include: sessionUtil

This will handle the saving and retrieving of the session variable we set. This will set for each unique session. By using this we only show the popup once each session.

var sessionUtil = Class.create();
sessionUtil.prototype = Object.extendsObject(AbstractAjaxProcessor, {
    handleSession: function(){
        var session = gs.getSession();
        if(session.getClientData('popup_triggered')){
            return false;
        }
        session.putClientData('popup_triggered', true);
        return true;
    },
    type: 'sessionUtil'
});

 

Any improvements or suggestions are welcome.

Comments
ah16
Mega Expert

Thank you for writing an article on this. I'll trying using the sessions instead of storing in the table.

Any suggestions how not to invoke this terms page dialog on the login page? For now, I hard code it not to show it for guest user.

Willem
Giga Sage
Giga Sage

For me using the User Session solved this. Just to be sure I also included

if ((window.name !== 'gsft_main') || (window.parent.document.URL.indexOf("login.do") > -1)) {
        console.log("Prevent popup in this window or on this page.");
        return;
    }

But I don't think that is even needed.

ah16
Mega Expert

Great!. Let me try and will update you. Have you used UINotification() before? I'm trying to use this API for notifications but didn't worked. Please let me know if you have any idea how to create same type of notifications which we get when we close update sets.

Thanks again.

ah16
Mega Expert

I tried on my end and the only issue is I don't the see alert showing up on Dashboard page. Once, I logged in I went straight to Dashboard without accepting terms and conditions page.

And also it doesn't show up for showing up for Knowledge Page.

Willem
Giga Sage
Giga Sage

You can remove the "window.name !== 'gsft_main') || " condition. Then it will show on any type of page on first time.

ah16
Mega Expert

I removed but still doesn't work on Dashboard page.

ah16
Mega Expert

Other alternative is not to allow users access other links until they acknowledge the terms condition window. Any suggestions?

Willem
Giga Sage
Giga Sage

Found out that is a limitation of UI Script. It does only load on regular pages. So not in Dashboards or Knowledge pages for example.

It is not explicitly mentioned in the docs. But I found some mentions in the community. In the docs only line hinting at this is:

You can create a UI script and designate it as global, which makes the script available on any form in the system.

https://docs.servicenow.com/bundle/orlando-application-development/page/script/client-scripts/concep...

ah16
Mega Expert

Ohh. I thought UI Script is available on all pages not just only forms :). In that case, I'll have to redirect users to portal page where they acknowledge terms and conditions page first and then access system.

Have you done redirection to portal after logging in? I hope it is straightforward.

Thank you for all your help.

 

Willem
Giga Sage
Giga Sage

To redirect back-end users to portal you need to modify the 'SPEntryPage'-Script Include. However, you could just redirect to a different page in the back-end.

 

You can redirect back-end users to a different back-end page using 'glide.login.home'-System Property. In below example I redirect to incident.do after login:

find_real_file.png

Result after login:

find_real_file.png

arnabbhaumik
Tera Contributor

not seeing this pop up anywhere after login to my personal developer instance. How will can it be invoked?

arnabbhaumik
Tera Contributor

this pop up message appeared only once but not on each session while logging in. How can it be invoked everytime someone logs in to instance ? 

Palle
Tera Contributor

Hi Willem, 

 

Will this work on Mobile? I tested this by creating the UI script as Global and works perfect on Desktop Native UI. But, looks like global UI scripts won't work on mobile. So how do I trigger this UI script on Mobile and Desktop Native UI both? 

Appreciate any ideas!

 

Thank you

 

Willem
Giga Sage
Giga Sage

Hi RG,

You are right, this does not work on mobile as UI Scripts are not supported on mobile:

"UI scripts are not supported for mobile"

https://docs.servicenow.com/bundle/quebec-application-development/page/script/client-scripts/concept...

 

So mobile will require a whole different solution.

For other applications I have seen users first needing to confirm on desktop and then are allowed access to mobile. Perhaps something like that will work for you?

 

Might be good to log a question on the community for this, as I think this is a very interesting question! 🙂

Palle
Tera Contributor

Instead of using UI script here, I think we can create a UI page and do the GlideDialogWindow in the UI page client script and force all the users to the page we create after login and then we can redirect them to home.do by modifying the below property, this way we can make it work on mobile as well? any thoughts?

Property "glide.login.home"

 

Willem
Giga Sage
Giga Sage

GlideDialogWindow is depricated:

https://docs.servicenow.com/bundle/jakarta-application-development/page/app-store/dev_portal/API_ref...

 

GlideDialogv3 is the follow up on that, however I don't think it will work on the mobile app.

https://docs.servicenow.com/bundle/jakarta-application-development/page/app-store/dev_portal/API_ref...

 

You might have a look at this:

https://developer.servicenow.com/dev.do#!/reference/api/orlando/client_mobile/cabrillo-modal-namespa...

 

Or consider a specific page or UI Action to accept the conditions?

Rajat Gupta6
Tera Guru

This is not working for me. 

Steven Herrmann
Giga Guru

@Willem can this be used PRIOR to login?  DoD wants a banner with a mandatory "accept terms and conditions" but before the ability to login is even presented.  Hopefully this makes sense.  Thank you in advance!

ldaponte
Tera Contributor

@Steven2 did you ever find a solution to showing this terms page?  Sounds like I have the same requirement as you - showing this once for every session login regardless of ServicNow content (form/page/portal/kb etc).

Alon Grod
Tera Expert

@Willem Hi its not working for me, can I share what I have done?

Version history
Last update:
‎08-27-2020 05:20 AM
Updated by: