121
Views
3
Comments
Disable dates in date picker range
Question
Application Type
Reactive

Hi all, 

I just got started with outsystems. I want to make a booking application, where you can book rooms. Simple as that. All I want is a dropdown with the different dates. Then i want a date picker range where the already booked dates are disabled. I have seen people do this with the property "DisabledDates" including a list of dates. The problem is: I do not have this property. Should I use a different application type, or is there something else I can do

Thank you in advance,

Rick van Veldhuisen

2022-08-03 04-32-50
Ravi Punjwani

Hi Rick,

OutsystemsUI's DatePickerRange doesn't have the disabled dates feature.

If you have javascript skills, you can clone OutsystemsUI module and customize as per your requirements.

This widget internally uses flatpickr library https://github.com/flatpickr/flatpickr which supports disabling specific dates. So the level of customization won't be extreme in your case.

UserImage.jpg
Rick van Veldhuisen

Hi @Ravi Punjwani,

First of all: thank you for your quick reply. It is much appreciated.

Second, is this the same for the regular DatePicker? I have seen it appear in videos and sreenshots such as in https://www.youtube.com/watch?v=CxM5hGPYRLA at 3:30. Is this a custom date picker as well?


Thank you in advance

2022-08-03 04-32-50
Ravi Punjwani

No worries Rick, always happy to help here.

The one shown in this video is only DatePicker and not the DatePickerRange (both come from OutsystemsUI).

Internally both of them use the same javascript datepicker library flatpickr, but just come with different configuration options.

Community GuidelinesBe kind and respectful, give credit to the original source of content, and search for duplicates before posting.