[DateRangePicker] Documentation : How to add custom ranges

[DateRangePicker] Documentation : How to add custom ranges

Forge Component
Published on 20 Jun by Niels Favreau
3 votes
Published on 20 Jun by Niels Favreau


This component gives you the ability to show predefined ranges.

I already defined the most common ones (see screenshot above), but if you wish to add new ranges or change/remove the current ones, this documentation will help you implement them.

How to add custom ranges?

  • Open DateRangePicker eSpace. (not the demo one)
  • Open the DateRangePicker Webblock
  • Edit the expression and go to this part of the code :
  • Just add your custom range with the same syntax as the current one.

CUSTOM_RANGE_NAME = The label that will be displayed when opening the calendar
START_DATE = Start date of your custom range.
END_DATE = End date of your custom range.

Start_date and End_Date can be calculated inside the function, like the already predifined ranges)

Important: MultipleDateFormat() is required. To avoid date formatting issues and runtime errors, use the DateFormat input paramater that is being used for your calendar.

And ofcourse: When you add a new range, dont forget to add a ',' before it :)

Hi Niels,

What would be great is an additional input for LocalCurrDate setting instead of always using servers Currdate().

We're UTC +10 locally with servers on UTC time so 'Today' isn't alway today :-)



Hi Steve!

Thank you for your suggestion.
I will add this the newer version.

Thank you,

Niels F.