[Expand]General Information
[Collapse]WinForms Controls
  .NET Core Support
 [Expand]What's Installed
 [Expand]Build an Application
 [Collapse]Controls and Libraries
  [Expand]Forms and User Controls
  [Expand]Messages, Notifications, and Dialogs
  [Expand]Editors and Simple Controls
  [Expand]Ribbon, Bars and Menu
  [Expand]Application UI Manager
  [Expand]Docking Library
  [Collapse]Data Grid
   [Expand]Get Started With Data Grid and Views
   [Expand]Data Binding
    Unbound Columns
   [Expand]Data Editing and Validation
   [Expand]Filter and Search
   [Expand]Focus and Selection Handling
    Format Cell Values
   [Expand]Master-Detail Relationships
   [Expand]Asynchronous Image Load
   [Expand]Export and Printing
   [Expand]Appearance and Conditional Formatting
    Split Presentation
    Row Preview Sections
   [Expand]Batch Modifications
    Hit Information
    Popup Menus
   [Expand]Save and Restore Layout
   [Expand]Visual Elements
   [Expand]Design-Time Features
   [Expand]End-User Capabilities
    Included Components
  [Expand]Vertical Grid
  [Expand]Property Grid
  [Expand]Pivot Grid
  [Expand]Tree List
  [Expand]Gantt Control
  [Expand]Chart Control
  [Expand]Map Control
  [Expand]Rich Text Editor
  [Expand]Spell Checker
  [Expand]Form Layout Managers
  [Expand]Navigation Controls
  [Expand]PDF Viewer
  [Expand]TreeMap Control
  [Expand]Sunburst Control
 [Expand]Common Features
  Get More Help
 [Expand]API Reference
[Expand]ASP.NET Controls and MVC Extensions
[Expand]ASP.NET Bootstrap Controls
[Expand]ASP.NET Core Bootstrap Controls
[Expand]WPF Controls
[Expand]Xamarin Controls
[Expand]Windows 10 App Controls
[Expand]Office File API
[Expand]Report and Dashboard Server
[Expand]eXpressApp Framework
[Expand]eXpress Persistent Objects
[Expand]CodeRush Classic
[Expand]Cross-Platform Core Libraries
[Expand]Tools and Utilities
 End-User Documentation
View this topic on docs.devexpress.com (Learn more)

Format Cell Values

This topic covers methods you can use to format cell values and substitute display values with custom ones.

Expanded Unbound Columns and HTML Text

You can format cell text using a simplified HTML syntax by embedding a RepositoryItemHypertextLabel in-place editor into a column. This feature allows you to:

  • change the font, size, and color of a cell's text;
  • display images;
  • insert clickable hyperlinks.

The cells' data can be provided at data source level. You can also generate HTML text dynamically using unbound (calculated) columns.


Hyper Text module in the XtraEditors MainDemo

Expanded Standard .NET Formatting Mechanism - Format Patterns and Custom Formatters

You can employ the standard .NET formatting mechanism to format numeric and date-time column values based on a standard or custom pattern, perform composite formatting (combining standard format specifiers with custom text), and implement custom formatting by creating a custom formatting object.

You can access the formatting functionality at two levels:




Column Level


This is the most common approach to formatting values in display mode (when cell editing is inactive).

Repository Item (in-place editor) Level

RepositoryItem.DisplayFormat and RepositoryItem.EditFormat

This approach can be used to format cell values in display mode and when the editing operation is initiated. However, we recommend using masks instead of the EditFormat property to restrict end-user input to a specific pattern and formatting values in edit mode.

Customizing the DisplayFormat property at the repository item level is helpful in the following cases:

  • When you want to share value formatting settings between multiple columns or controls: Create a repository item, customize its settings and assign the item to target columns/controls. See Editors and Simple Controls to learn more.
  • When you want to use different formatting settings for different cells within a single column: Create and customize multiple repository items, and then assign these repository items to target cells by handling the Data Grid's GridView.CustomRowCellEdit or LayoutView.CustomRowCellEdit event.

The Formatting Values topic provides more information on the standard .NET formatting mechanism. You can find examples below.

Expanded Example 1 - Formatting Numeric and Date-Time Display Values

In the following example, the Data Grid contains two columns displaying numeric and date-time values. Values in the Model Price column are formatted as currency; values in the Sales Date column are displayed as a long date pattern.

As mentioned above, value formatting performed using the DisplayFormat property is not persisted when you switch to cell editing. To perform cell formatting in edit mode, use masks (see a section below).

Expanded Example 2 - Composite Format Pattern

The following example shows how to add custom text to value formatting:

Custom formatters allow you to implement complex formatting scenarios. See Formatting Values for more information and examples.

Expanded Masks

Masks are helpful when you need to provide cell value input according to a particular pattern, but are only in effect when a cell is in edit mode, by default. However, you can activate the UseMaskAsDisplayFormat option to use masks to format cell values in display mode.


Activating the UseMaskAsDisplayFormat option may reduce the Grid Control's performance when it is bound to a large data source.

To use a masked input, first explicitly assign a text editor (RepositoryItemTextEdit) or its descendant to a target column with the GridColumn.ColumnEdit property. Then, initialize the mask settings from the RepositoryItemTextEdit.Mask property as required.

See Input Mask to learn more.

Expanded Example

The following example shows how to use a mask in the Phone grid column to allow only phone numbers:

Expanded Providing Custom Display Text via Event

The ColumnView.CustomColumnDisplayText event can be handled to display custom text in specific cells.

Expanded Example

The following example shows how to dynamically customize the cell's display text by handling the ColumnView.CustomColumnDisplayText event.

The grid View in the example contains the CurrencyType and Price columns. If the currency type is equal to 0, the price is displayed in dollars; if it is equal to 1, it is displayed in euros.

Expanded See Also

Is this topic helpful?​​​​​​​