We feel that using separate controls for editing dates and times is a good idea in most cases because:
- Sometimes only the date or time parts of the Date object is relevant, and the other can be ignored;
- If both date and time parts are relevant, you can bind an InputDate and an InputTime control to the same Date object and edit both parts independently. This usually makes editing easier and clearer. (This is the approach used by the Outlook calendar for example)
Here is a screenshot showing the InputDate and InputTime controls side by side:
But there are exceptions. You may want to allow users to edit both date and time and you may not have enough real estate on your layout to accommodate two controls. In these cases it would be convenient to consolidate the date and time editing into a single control.
To handle this scenario, we added a new InputDateTime control. It provides an editing element where users may type the date and time, and two separate drop-downs that can be used to quickly pick a date or a time.
The InputDateTme extends the InputDate control, so its object model is familiar and consistent.
Here's a screenshot showing the InputDateTime control:
Of course all the controls are localizable, themable, and have full keyboard and mouse support.
Added in version 5.20153.110
CSS icons in InputDateTime
Like all icons used in Wijmo controls, these are built using CSS which is included in the wijmo.css file. Defining icons in CSS has several advantages over using images:
- The icons scale automatically when the font size changes
- Their color adapts automatically to match the current theme
- They do not require separate files or downloads
- They can be easily customized using CSS (you can use images if you choose to).
Because the icons are included with wijmo.css, you can use them in your applications if you want. See a complete list of the icons included in the wijmo.css file.
Expanded in version 5.20153.108