Date Format Validation in the new Service Portal

[Katie A]

The fact that ServiceNow does not provide any built-in field validations causes a lot of time consuming extra work in general. The new Service Portal does not support very many built-in functions and this causes even more extra work.

How are we supposed to validate a date format in the ServiceNow Service Portal?

The Date picker accepts mal-formatted dates.

In our CMS I was using the getDateFormat function to ensure that the date is a valid format. This works fine. However, it is to no surprise, not supported in the new Service Portal.

   function isValidDate(dateVal) {
   var userDateFormat = getDateFromFormat(dateVal, g_user_date_format);
   return userDateFormat;
   }

So in order to validate a date format, I would need to write several RegExes to manually parse out every possible date format in the system.

Anyone run into this issue?

Servicenow really needs to provide some built-in validations... it would save a lot of tedious extra work.

[sunilsingh]

I have also faced the same problem and instead of using any Servicenow standard library , we went ahead with external JS called Moment.

Just import https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.14.1/moment.min.js under JS Includes as JS file URL and use moment object in the client script or whereever you want to use it.

The sample below shows how you can use that in Client Script:

if(!moment){

  var dateFormat = g_user_date_format;

  var startDateStr = new Date(getDateFromFormat((g_form.getValue('travel_start')), dateFormat));

  var endDateStr = new Date(getDateFromFormat((g_form.getValue('travel_end')), dateFormat));

  startDateStr = formatDate(startDateStr, dateFormat);

  endDateStr = formatDate(endDateStr, dateFormat);

  isEndBeforeStart = compareDates(startDateStr , dateFormat , endDateStr   , dateFormat);

  } else {

  // if moment.js is included in the Service Portal then using that library for comparison. Add moment libary in Service portal before using

  isEndBeforeStart = moment(g_form.getValue('travel_start')).isAfter(g_form.getValue('travel_end'), 'day');

  }

');

Hope this helps.

[Inactive_Use445]

This helped me out, thank you.

I needed to simply validate a date as this seems to be totally missing from the ServicePortal although it happens automatically in the normal UI.

I'm using an onSubmit Catalog Client Script and have included moment.js in the stock theme:

function onSubmit() {

  if(moment) {

          //Service Portal uses moment.js to validate as date validation is missing OOTB

          var dateFormat = g_user_date_format;

          var outageStartValue = new moment(g_form.getValue('outage_start'),dateFormat);

                if(!outageStartValue.isValid()) {

                      //Date is invalid - clear it

                            alert("Invalid Date. Please select using the calendar icon.");

                                g_form.setValue('outage_start',null);

                          return false;

                  }

      }

}

Still adding a bit of polish but that seems to do the trick so far.

[shegde]

This was perfect for me. We had multiple date variables used in Service Portal that needed validation and prevent people from typing in manually. I added moment.js as a UI Script, and used the following in an onChange catalog client script:

function onChange(control, oldValue, newValue, isLoading) {  

      if (isLoading || newValue == oldValue) {  

                  return;  

      }  

//Service Portal uses moment.js library (see UI script) for date validation as it's missing OOTB

if(moment) {

//Set date format and field values to compare using moment  

          var dateFormat = g_user_date_format;

          var startDateValue = new moment(g_form.getValue('start_date'),dateFormat);

//Throw an error if date format is invalid  

                if(!startDateValue.isValid()) {

                      //Date is invalid - clear it

g_form.hideFieldMsg('start_date',true);

g_form.showFieldMsg('start_date','Invalid date format. Please select using the date picker.','error');

g_form.setValue('start_date',null);

                          return false;

                  }

else {

g_form.hideFieldMsg('start_date',true);

}

      }

}

[ServiceNow SA]

Is this script working in native UI as well?