[] 
(Showing Draft Content)

Date

FlexGrid, by default, uses the Date editor for all the Date and DateTime type of data. The Date editor consists of a dropdown which opens a calendar when clicked and user can select the desired date by navigating through it. User can also change the date, month or year by simply selecting the corresponding part in the editor and pressing the up and down arrow keys.

Default Date Editor

Date Editor Without Calendar

Date Editor with Spin Button

Built-in date editor

Date editor without calendar

Date editor with spin button

Use the code below to create a Date editor in a WinForms FlexGrid column.


// Set the data type property to DateTime c1FlexGrid1.Cols[1].DataType = typeof(DateTime); 
' Set the data type property to DateTime c1FlexGrid1.Cols(1).DataType = GetType(Date) 

Input without Displaying Calendar

As mentioned earlier, in FlexGrid, a DateTime type cell automatically displays a dropdown calendar to receive the input from user. However, in order to get a date input from user without displaying a calendar, you can set a mask using the EditMask property and then validate the input value using the ValidateEdit event.


Following code demonstrates how to create a Date editor without calendar in WinForms FlexGrid


// Set a mask on column c1flexGrid1.Cols[3].EditMask = "00/00/0000";
' Set a mask on column c1flexGrid1.Cols(3).EditMask = "00/00/0000" 

For more information about cell masks and validation, see topics Mask and Validation respectively. Another way of hiding the calendar is to get user input using the spin buttons.

Input using Spin Button

Below code shows how to create Date editor with spin button.


To display spin buttons in a Date editor, use the SetupEditor event to convert the editor into DateTimePicker and set its ShowUpDown property to true.


private void C1flexGrid1_SetupEditor(object sender, RowColEventArgs e) { if (c1flexGrid1.Cols[e.Col].Name == "DOB") { // Cast FlexGrid's current cell editor  var dateEditor = c1flexGrid1.Editor as DateTimePicker; // Show UpDown button (replacing the drop-down button for calendar) dateEditor.ShowUpDown = true; } } 
Private Sub C1flexGrid1_SetupEditor(ByVal sender As Object, ByVal e As RowColEventArgs) If c1flexGrid1.Cols(e.Col).Name Is "DOB" Then ' Cast FlexGrid's current cell editor  Dim dateEditor = TryCast(c1flexGrid1.Editor, DateTimePicker) ' Show UpDown button (replacing the drop-down button for calendar) dateEditor.ShowUpDown = True End If End Sub 

Set Date Format

To set the format in a Date type column, you need to set the Format property of the Column object.


Following table lists the pre-defined formats:

Format

Value

Example

Short Date

d

11/19/2003

Long Date

D

Friday, November 19, 2003

Short Time

t

12:15 AM

Long Time

T

12:15:30 AM

You can also create a custom format using the various custom format specifiers supported in the .Net framework. For details, see Custom date and time format strings on Microsoft website.


Use the following code to create a custom date format in WinForms FlexGrid column.


// Set a pre-defined format c1FlexGrid1.Cols[DOB].Format = "d"; // Set a custom format c1FlexGrid1.Cols[OrderDate].Format = "dd/MM/yyyy"; 
' Set a pre-defined format c1FlexGrid1.Cols(DOB).Format = "d" ' Set a custom format c1FlexGrid1.Cols(OrderDate).Format = "dd/MM/yyyy" 

Display Country-specific Date Format

Although abovementioned formats are the most commonly used date formats, but there are cultures which prefer using their specific calendar and date formats in some cases such as Japan. You can display those specific calendars and date formats by using OwnerDrawCell event of the C1FlexGrid class and the System.Globalization namespace. The namespace provides various classes to define culture related information including calendars and date formats. For instance, to display Japanese calendar and Japanese date format, you can leverage the System.Globalization.JapaneseCalendar class. Similarly, you can also display other calendars such as Gregorian, Hebrew, Hijri, and Korean.


Country specific calendar and date format


Set the country specific date format in WinForms FlexGrid using the code below.


c1flexGrid1.Cols["DOB"].Format = "dd/MM/yyyy"; c1flexGrid1.DrawMode = DrawModeEnum.OwnerDraw; c1flexGrid1.OwnerDrawCell += C1flexGrid1_OwnerDrawCell; private void C1flexGrid1_OwnerDrawCell(object sender, OwnerDrawCellEventArgs e) { if (c1flexGrid1.Cols[e.Col].DataType == typeof(DateTime) && e.Row >= c1flexGrid1.Rows.Fixed) { e.Text = DateTime.Parse(e.Text).ToString("yyyy年MM月dd日(dddd)", c); } } 
C1FlexGrid1.Cols("DOB").Format = "dd/MM/yyyy" C1FlexGrid1.DrawMode = DrawModeEnum.OwnerDraw AddHandler C1FlexGrid1.OwnerDrawCell, AddressOf C1flexGrid1_OwnerDrawCell Private Sub C1flexGrid1_OwnerDrawCell(ByVal sender As Object, ByVal e As OwnerDrawCellEventArgs) If C1FlexGrid1.Cols(e.Col).DataType = GetType(DateTime) AndAlso e.Row >= C1FlexGrid1.Rows.Fixed Then e.Text = DateTime.Parse(e.Text).ToString("yyyy年MM月dd日(dddd)", c) End If End Sub 

Set Min/Max Date

To set a range of valid values, you can use the DateTimePicker control as editor and set its MinDate and MaxDate property.


Use the code below to set a range of valid dates in WinForms FlexGrid.


DateTimePicker dateTimePicker = new DateTimePicker(); dateTimePicker.Format = DateTimePickerFormat.Short; // Sets Max and Min dates  dateTimePicker.MinDate = new DateTime(2015, 05, 01); dateTimePicker.MaxDate = DateTime.Today; // Assigns DateTimePicker control as editor for FirstOrderDate(date) column c1flexGrid1.Cols["FirstOrderDate"].Editor = dateTimePicker; 
Dim dateTimePicker As DateTimePicker = New DateTimePicker() dateTimePicker.Format = DateTimePickerFormat.[Short] ' Sets Max and Min dates  dateTimePicker.MinDate = New DateTime(2015, 05, 01) dateTimePicker.MaxDate = Date.Today ' Assigns DateTimePicker control as editor for FirstOrderDate(date) column c1flexGrid1.Cols("FirstOrderDate").Editor = dateTimePicker 

See Also

Documentation


Date