Hi,
In reactive web When there is no date in the input variable time is always defaulted to 12:00 The output i want is to display a date from and date to , date from time will be 00:00 and date to will be 23:59 when input is empty, just like how the error log from service center.
Current
Expected:
@kah leong ng :
As I understand it, you have two DatePicker widgets and you want:
The start DatePicker to default to 00:00, and
The end DatePicker to default to 23:59, but right now they both default to 12:00.
OutSystems DatePicker is based on the Flatpickr.js component (https://flatpickr.js.org/). You can configure it using the SetFlatpickrConfigs client action from OutSystemsUI, which maps to the options listed here: https://flatpickr.js.org/options/. In Flatpickr, the options defaultHour and defaultMinute are exactly what you need to achieve this.
However, OutSystems’ SetFlatpickrConfigs does not take raw JSON, and the FlatpickrConfigs structure does not expose defaultHour and defaultMinute.
This is how I worked around it (note: this is not an official OutSystems recommendation):
Open a clone of OutSystemsUI.
Copy the FlatpickrConfigs structure to your module and rename it to FlatpickrConfigs_v1.
Copy the SetFlatpickrConfigs client action to your module as SetFlatpickrConfigs_v1 and set its Public property to No.
Update SetFlatpickrConfigs_v1 to use FlatpickrConfigs_v1.
Copy the ReturnMessage structure from the cloned OutSystemsUI to your module.
Modify FlatpickrConfigs_v1:
Remove all existing attributes.
Add defaultHour and defaultMinute as Text data type. (Important: if you use Integer, setting 0 will not work correctly and defaults to 12)
In the OnReady action of your screen, call SetFlatpickrConfigs_v1, pass the WidgetId of your DatePicker, and set the values of defaultHour and defaultMinute as needed (e.g., 00 / 23 and 00 / 59).
With this approach, you can have one DatePicker default to 00:00 and the other to 23:59 instead of the default 12:00.
Hello,
Set the default value of the local variable used by the Date Picker to your desired date and time. Once assigned, it will automatically display that value in the component. If you only want to set the time, you can do so by specifying just the time in the default value.
Hi @kah leong ng
I agree with @Sherif El-Habibi — that approach works well.Another option is to configure the Date Picker directly by setting the InitialDate format inside the OptionalConfig of the DatePicker widget.
Hope this helps,
Peter Hieu.