Infragistics logo
메뉴
.NET and JavaScript UI Controls
Version

Please note that this control has been retired and is now obsolete to the XamDataGrid control, and as such, we recommend migrating to that control. It will not be receiving any new features, bug fixes, or support going forward. For help or questions on migrating your codebase to the XamDataGrid, please contact support.

DateTimeColumn

Topic Overview

Purpose

This topic explains how to display DateTime data in the xamGrid™ control using the DateTimeColumn column type.

Required background

The following table lists the topics required as a prerequisite to understanding this topic.

Topic Purpose

This topic describes the xamGrid column types based on the property’s data type in the underlying data source.

In this topic

This topic contains the following sections:

Requirements

Introduction

When you use the DateTimeColumn several references to additional assemblies are required.

Requirements

In order to add the DateTimeColumn to the XamGrid control, you need to add the following NuGet package reference:

  • Infragistics.WPF.Controls.Grids.DateTimeColumn

For more information on setting up the NuGet feed and adding NuGet packages, you can take a look at the following documentation: NuGet Feeds.

Adding a DateTimeColumn Column to xamGrid

Overview

The following example demonstrates how to add a DateTimeColumn column to the xamGrid control and sets its key properties. It also demonstrates how to apply a mask to format the displayed DateTime value.

Property settings

The following table maps the desired configuration/behaviors to property settings.

In order to: Use this property: And set it to:

Apply a mask to the displayed DateTime value

A string representing the mask applied to the displayed DateTime value.

The following are some example masks:

  • {date} - Creates a date-only mask based on the short date pattern.

  • {time} - Creates a time-only mask based on the short time pattern.

  • {longtime} - Creates a time-only mask based on the long time pattern, which typically includes seconds.

  • {date} {time} - Creates a date and time mask based on the short date and short time patterns.

  • mm/dd/yyyy - Creates a date-only mask.

Note
Note

The curly brackets are part of the syntax.
Note
Note

When specifying the mask within the XAML code and using one of the special tokens that are enclosed within the curly brackets, you must precede the mask with {} - e.g. { }{ date} .

Code Example

Description

The following code snippet demonstrates how a DateTimeColumn is added to the xamGrid control to visualize the DateTime values of the underlying data. It also demonstrates how a mask is applied to format the display DateTime value.

The screenshot below demonstrates how the DateTimeColumn and xamGrid look as a result of the following settings:

Property Value

SelectedDateMask

{}{date} {time}
xamGrid DateTimeColumn 1.png

Code

In XAML:

<ig:XamGrid x:Name="dataGrid"
            ItemsSource="{StaticResource Patients}"
            AutoGenerateColumns="False"
            ColumnWidth="*">
    <ig:XamGrid.Columns>
        <!-- Add more columns here -->
        <!-- Add DateTimeColumn here -->
        <ig:DateTimeColumn Key="AdmittanceDate"
                           SelectedDateMask="{}{date} {time}"
                           HeaderText="Admittance Date" />
        <!-- Add more columns here -->
    </ig:XamGrid.Columns>
</ig:XamGrid>

Related Content

Topics

The following topics provide additional information related to this topic.

Topic Purpose

This topic describes how DateTime data can be displayed in the xamGrid control.

The topic lists all possible mask characters and tokens that the mask syntax supports.

This section contains valuable information about the xamDateTimeInput™ control, ranging from what the control does and why you would want to use it in your application, to step-by-step procedures on how to accomplish common tasks using the control.