Data Formats in Blazor Grid

By default, if data formats are not used, the IntegralUI Grid will show it as plain text in each column cell, regardless of value type. Using data formats can help displayed data to become more readable. This is usually the case when you have Dates or localized Currency numbers displayed in the Blazor Grid.

Grid component is part of IntegralUI for Blazor
a library of UI components for Blazor .NET

If you have any questions, don't hesitate to contact us at support@lidorsystems.com

This demo shows several columns with different data formats set depending on the value type. Dates are displayed in short format, floating numbers are displayed in USD currency format with two decimals and integer numbers have commas separating digits by thousand.

Supported Data Formats in Blazor Grid

The IntegralUI Grid component supports the following data formats

All available formatting options (standard and custom) from the NumericFormat and DateTimeFormat, are usable in the Grid. Same for String values, you can format the text to appear by providing the format specifier.

Each grid column can have its own data format set. You can do this within column definition in Blazor HTML or in code by setting the FormatSpecifier property for the data column object to a specific format string. Here are few examples:

Column where numbers are displayed as USD currency:

Column where numbers are displayed in percents with two decimals:

Column with dates where day has two digits, a short name for a month and year in full:

Try it for FREE
30-day free technical support

Localization

To show dates in different language like Japanese, just set the Locales property to "ja-JP" and set the FormatSpecifier property to corresponding date pattern. In addition, you can also provide your own CultureInfo object to the Culture property.

There are many other options to choose from, including language localization. For more information, check out the official .NET documentation for data formatting.

Conclusion

IntegralUI Grid component for Blazor .NET has built-in support for standard and custom data formats available. Each column can have a different data format set with customizable options. You can show numbers as localized currency, choose how many decimals displayed numbers can have, whether you want to show percentages, etc. In addition, all known date formats are supported, including language localization.

IntegralUI for Blazor is a library of advanced UI components that includes the Grid Component. You can use it to develop modern web apps with Blazor .NET framework.