How can I have my FlexGrid use a C1DateTimePicker for my DateTime columns?

Posted by: jacob.a.buchanan6.ctr on 15 July 2026, 5:56 pm EST

    • Post Options:
    • Link

    Posted 15 July 2026, 5:56 pm EST

    I have a class with several properties, and some are DateTimes. I have a FlexGrid with AutoGenerateColumns turned on. I saw that it was assigning a GridDateTimeColumn to the column which has a mode for GridDateTimeColumnMode but this only has values for Time or Date which use a C1TimePicker and C1DatePicker respectively.

    I tried setting up a custom GridCellFactory and in CreateCellEditor i did this:

    if (Grid.GetCellValue(range) is DateTime datetime)
    	return new C1DateTimePicker(){DateTime = dateTime};
    return base.CreateCellEditor(range);

    This will show the C1DateTimePicker when editing the cells now, but I can’t figure out how to apply the value. By default, it just errors out because it calls GridDateTimeColumn’s GetEditorValue and tries to cast my editor to either a C1DatePicker or a C1TimeEditor and both cast fail. I believe it would fail with other GridColumn types since they similarly cast the editor to a type.

    Any ideas?

  • Posted 15 July 2026, 6:21 pm EST

    Ahh, I made the post and then figured out something that works, although I still don’t know if this is the intended solution to this or not.

    I added an override for the OnEditEnded method with this:

    if (editor is C1DateTimePicker dateTimeEditor)
    {
    	Grid.SetCellValue(range, dateTimeEditor.DateTime);
    	editCancelled = true;
    }
    base.OnEditEnded(range, editor, editCancelled);

    By setting editCancelled to true it no longer hits those GetEditorValue() calls.

    The only other very minor issue is how wide the C1DateTimePicker is. It would be ideal if I could float it like a popup, but I assume that would behave weird with the popups that the C1DateTimePicker opens. For now, I just listen to PrepareCellForEdit and if the column being edited is one of my date columns, then I resize the column to 200 and then auto size the column back to normal when editing ends.

  • Posted 16 July 2026, 5:50 am EST

    Hi,

    Thank you for sharing all the details.

    The best way to use a custom editor in a GridColumn is by defining its CellEditingTemplate. This is typically done directly in XAML, where you can bind the custom editor to the same property as the column. The FlexGrid then handles the editing and persistence automatically.

    However, since you are auto-generating the columns, you can simply define a custom DataTemplate in XAML and apply it to the auto-generated column in the AutoGeneratingColumn event of the FlexGrid.

    Please refer to the attached sample project for reference - FlexGridCustomEditor.zip


    Regarding your implementation, it is also correct and should work without any issues. The only difference is that it requires some manual handling to retrieve and assign the values to and from the C1DateTimePicker, whereas our approach simply binds the same property as the column to the C1DateTimePicker, allowing the control to handle the retrieval and assignment of values internally.


    Regarding the column width, please note that the editor is displayed inside the cell by default. Therefore, it automatically follows the size of the cell. If you want the editor to be wider, the only option is to increase the width of the column itself.

    Best Regards,

    Kartik

Need extra support?

Upgrade your support plan and get personal unlimited phone support with our customer engagement team

Learn More

Forum Channels