Forms & Tasks Designerπ π§¨
Elements
Date-time Input
8 min
π
datetime control β procesio forms the datetime control lets you capture or display date and/or time values in your forms with flexible configuration options it supports multiple modes , customizable intervals , range restrictions, and event triggers π features & modes πΉ modes choose how the control behaves mode description datetime user selects both date and time date only date selection time only time selection π default datetime πΉ inline view mode when enabled (inline true), the control renders directly in the form instead of using a popup calendar/time picker ideal for always visible date/time selection controls π range limits πΉ min & max define the valid selection boundaries property purpose mindate earliest date/time allowed maxdate latest date/time allowed these prevent users from picking values outside the desired range π« disable & enable specific ranges πΉ disabled intervals use disableddates to block specific dates or intervals these values are lower priority than availabledates πΉ available intervals use availabledates to explicitly define allowed intervals takes precedence over disabled sets β only these ranges are selectable if defined β± time intervals configure the minute step for time selection property purpose minuteinterval step in minutes between selectable times (only in time/datetime) example setting this to 15 allows only 15 minute increments π§ other useful options property function disabled make control non interactive readonly user can view but not edit visible show/hide the control clearable allow clearing the value hasnow offers a quick βnow/todayβ button showdisabledtimeoptions show disabled time options in list required mark field as mandatory π events & mapping you can map control events (e g , value change) to trigger process or trigger javascript actions enabling automation workflows when users interact with the control examples include triggering a process when the date changes running custom javascript based on user input π§ͺ typical usage scenarios β collect birth date only set mode "date" β schedule a meeting use mode "datetime" define minuteinterval 15 for common time slots restrict with mindate and maxdate β time only slot booking set mode "time" use availabledates to limit available hours api name description type values default label display label string mode input mode string datetime , date , time datetime inline inline view boolean false placeholder hint text string tooltip help text (displayed with label) string infotext additional info displayed under input string defaultvalue initial value date | string | null mindate minimal value date | string | null maxdate maximal value date | string | null disableddates disabled date time intervals this value has lower priority compared to availabledates array< string | date | { start date | string | null; end date | string | null; } \> \[] availabledates available date time intervals this value has priority over disableddates array< string | date | { start date | string | null; end date | string | null; } \> \[] minuteinterval minute interval applicable to datetime and time modes number 1 value current value date | string | null readonly if true, input is readonly boolean false disabled if true, input is disabled boolean false visible if false, element is hidden boolean true clearable if true, can clear value boolean false hasnow quick βtoday/nowβ option boolean true showdisabledtimeoptions show disabled time options applicable to datetime and time modes boolean false name unique element name string id unique element id string required if true, input is mandatory boolean false for support, please join our https //discord com/invite/cebukgjefv for further assistance and support
