Date

In This Topic

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

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

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

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.

C#
VB.NET

   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.

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.

C#
VB.NET

   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.

C#
VB.NET

   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

Documentation

Date