In Date picker how to show default date range selected
Application Type

I want to show default date range selected before modifying date range on screen load like below screenshot

It is working  after date range selected on screen but My requirement is it show by default selected . 

Thanks and Appreciated for solution in Adv.


Nik G


set the startdate and enddate property as per your requirement using the AddDays function.




@Suprio Roy I want this functionality at initialize level  , where I can set this date range option . Plz share screenshot .

Thank you !

you need to configure datepicker as given this url :

Need to call these 2 methods to set the date range initially , can call on onOpen callback of pickaday datepicker.

@Vikas Sharma Thank you for reply ,

Can you please give me idea how I can write this above Range() function in date picker widget means ON ready event or Adv. format option . Plz provide  OnOpen() call back action JavaScript code so it is very easy to me understand .

Thanks for help !

you can set the value by java script. Can follow below two links :

Same way you can set the value of startRange and endRage and other parameters as mentioned on this page.

apart from this for easy solution I think can use the forge component suggested by Vijay.

Hi @NNG,

You can use the forge component which is named as DateRangePicker.

1. By dragging the DateRangePickerCombo into your screen.

2. Assign the values of startdate and enddate like you mentioned the Range From_Date and Start_Date.

It is a block so use Event Handler.

If you have only one date and if you wants to show the range enter the static value by using AddDays()  function to From_Date.

Please find the below Demo Link and attached OML.


I hope this helps.

- Palle Vijay Bhaskar Reddy


Thank you for your time !

There is any way to show same functionality inbuilt datepicker widget of OutSystems . OR as per your demo can we hide left part and showing only one calendar .

Yes, You can do the same with Date picker as well.

Just confirm me that You are having two date in your entity like Start Date and End Date. OR only One date Attribute ?

Hi Dear Vijay,

Can you explain how to set up a start and end date on the default date picker? Seems there's only one parameter for initial date (start date) and there's no parameter to set the end date.

The start and end values for the range referred in some comments above are to setup the minimum and maximum values allowed in the calendar and has nothing to do with the start and end date values that we want to setup as default values.


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