Date Picker with Start and End dates

[lpolicarpio]

Hi team,

We have a requirement to have a date field in which you can select the start and end dates (like when you're booking a flight or a hotel). Have you implemented something like this in a record producer or widget? Would really appreciate for some ideas on how it can be done.

Thank you!

[AnirudhKumar]

Those date pickers on flight booking websites are super-intuitive with basically a single calendar where you click the start and click the end date. It's not impossible to build that in ServiceNow, but you're better off simply creating 2 date/time fields - one for start date, other for end date. 

Just add validations that start date cannot be after end date and end date cannot be before start date, etc 🙂

[Tejas Adhalrao]

Hi  ,

The key thing to know is that ServiceNow OOTB variables do not support a “date range picker” (start + end in one field) like  hotel booking systems.

Use two Date/Date-Time variables in the Record Producer.

Variable Type

Start Date	Date
End Date	Date

then add the validation using the client script (to ensure End > Start)

 on change - end date field

when you select the end date it will validate end date is > start date

 you can refer below client script:

function onChange(control, oldValue, newValue, isLoading) {
    if (isLoading) return;

    var start = g_form.getValue('start_date');
    var end = g_form.getValue('end_date');

    if (start && end && end < start) {
        g_form.showFieldMsg('end_date', 'End date must be after Start date', 'error');
        g_form.setValue('end_date', '');
    }
}

 If you found my solution helpful, please mark it as Helpful or Accepted Solution...!

thanks,

tejas

Email: adhalraotejas1018@gmail.com

LinkedIn: https://www.linkedin.com/in/tejas1018