DayPicker in WinCC OA
This page demonstrates how to implement a date and time picker in WinCC OA. When an input field is clicked, a date and time picker will pop up, allowing the user to select a date and time. The selected value is then formatted and displayed in the input field.
Implementing the Date and Time Picker
To display a date and time picker when an input field is clicked, you can use the dateTimePicker
function. Once a selection is made, the value is converted to a string using formatTime
and displayed in the input field.
// This example is triggered when a specific input field is clicked.
// Replace 'YourInputField' with the actual panel element name.
// [YourInputField] [12] - [Clicked]
#uses "sched"
main(mapping event)
{
time selectedTime;
dateTimePicker(selectedTime, YourInputField);
string formattedTime = formatTime("%d/%m/%y", selectedTime);
YourInputField.text(formattedTime);
}
Formatting the Time
The formatTime
function allows you to format the time in a user-friendly manner. You can specify the desired format using the parameters described below.
// Example usage of formatTime to format the selected time
string formattedTime = formatTime("%d/%m/%y %H:%M", selectedTime);
// This will format the time as 'Day/Month/Year Hour:Minute'
Available Formatting Parameters
Below is a list of parameters you can use with formatTime
to customize the time format:
- %d - Day of the month (01 - 31)
- %m - Month (01 - 12)
- %y - Year without the century (00 - 99)
- %Y - Year with the century
- %H - Hour (00 - 23)
- %I - Hour (00 -12)
- %M - Minute (00 - 59)
- %S - Second (00 - 59)