How to: Enter date-time values

  • 2 minutes to read

You can use the DateEdit and TimeEdit controls to edit date-time values. These controls support masked inputs and provide dedicated UIs (drop-down calendar and tiles). However, you can customize any text editor to accept date-time values in the edit box.

DateEdit and TimeEdit Controls

The DateEdit and TimeEdit controls are used to display and edit date-time values. You can enter a value in the edit box according to a specific pattern or select a value from the editor's drop-down.

DateEditAndTimeEdit

Automatically skip value separators

When you enter a date-time value, the caret does not automatically moves between the date-time placeholders. To move the caret, set the editor's MaskProperties.MaskType (_editor._Properties.Mask.MaskType) property to MaskType.DateTimeAdvancingCaret.


dateEdit1.Properties.Mask.MaskType = DevExpress.XtraEditors.Mask.MaskType.DateTimeAdvancingCaret;

Change the input pattern

To change the default date-time pattern, use the MaskProperties.EditMask (_editor._Properties.Mask.EditMask) property.

The following example applies a mask that allows you to edit a DateEdit control's date and time simultaneously. See Mask Type: Date-time for information about mask specifiers.


dateEdit1.Properties.Mask.EditMask = "g";//"Short date/short time" pattern

DateEdit-gMask.png

Use the mask as a display format

Set the MaskProperties.UseMaskAsDisplayFormat (_editor._Properties.Mask.UseMaskAsDisplayFormat) property to true. The editor uses this mask to format its values in display mode (when the editor is not focused, or data edit operations are disabled).


dateEdit1.Properties.Mask.UseMaskAsDisplayFormat = true;

Storing values

The DateEdit and TimeEdit controls' values are of the System.DateTime data type. You can use the DateEdit.DateTime and TimeEdit.Time properties to access the current values. Use the editors' BaseEdit.EditValue property for data binding.

Text Editors

To allow a text editor (TextEdit or its descendant) to accept date-time values in the edit box, enable the DateTime or DateTimeAdvancingCaret mask type and specify the pattern with the MaskProperties.EditMask (_editor._Properties.Mask.EditMask) property.


textEdit1.Properties.Mask.MaskType = DevExpress.XtraEditors.Mask.MaskType.DateTimeAdvancingCaret;
textEdit1.Properties.Mask.EditMask = "d"; //'Short date' format
textEdit1.Properties.Mask.UseMaskAsDisplayFormat = true;
textEdit1.EditValue = DateTime.Today;

TextEdit-DateTimeMask

A field's data type should be System.DateTime to bind an editor to this field.

In unbound mode, an editor with the DateTime or DateTimeAdvancinCaret mask type automatically converts the entered text to a System.DateTime value and assigns this value to the editor's BaseEdit.EditValue property.

See Also