ASP.NET GridView: Format Numbers, Dates & Custom Data

What is Data Formatting in GridView?

By default, GridView displays values exactly as they are retrieved from the database. For example:

• 1350.3 might appear without commas or consistent decimals.
• 2025-09-10 20:45:00 might not look neat for users.

In ASP.NET, you can apply formatting directly inside the GridView by using:

<%# Eval("FieldName", "{0:Format}") %>

Here:

• FieldName = your database column name.
• {0:Format} = format string (like currency, date, percentage, etc.).

Formatting Numbers in GridView

Number formatting is useful for amounts, quantities, percentages, or financial values.

<asp:TemplateField HeaderText="Pay Amount">
    <ItemTemplate>
        <asp:Label ID="lblPayAmount" runat="server" 
                   Text='<%# Eval("PayAmount", "{0:N2}") %>'></asp:Label>
    </ItemTemplate>
</asp:TemplateField>

If the value is 1350.3, the result will be 1,350.30.

Common Number Formats

Use number format in GridView to make financial and numerical data more professional.

Formatting Dates and Times in GridView

Dates often need to be displayed in a user-friendly format.

<asp:TemplateField HeaderText="Payment Date">
    <ItemTemplate>
        <asp:Label ID="lblPayDate" runat="server" 
                   Text='<%# Eval("PayDate", "{0:MMM dd, yyyy}") %>'></asp:Label>
    </ItemTemplate>
</asp:TemplateField>

If the value is 2025-09-28, the result will be Sep 28, 2025.

Common Date & Time Formats

Use date format in GridView and time format in GridView to present values clearly.

Custom Formats in GridView

ASP.NET also allows custom format in GridView. This is useful when the standard formats don’t match your needs.

Example 1: Percentage with custom decimals

Text='<%# Eval("Discount", "{0:0.00}%") %>'

If Discount = 0.235, output = 0.24%.

Example 2: Phone number formatting

Text='<%# Eval("PhoneNumber", "{0:(###) ###-####}") %>'

If PhoneNumber = 1234567890, output = (123) 456-7890.

Standard .NET Format Specifiers (Reference)

ASP.NET formatting is based on .NET’s format specifiers. Here are some useful ones:

Numeric Standard Formats

• C → Currency ($1,350.30)
• D → Decimal integer (001350)
• E → Exponential/scientific (1.350300E+003)
• F → Fixed-point (1350.30)
• G → General (1350.3)
• N → Number with commas (1,350.30)
• P → Percent (23.50 %)
• X → Hexadecimal (546 → 222)

Date and Time Standard Formats

• d → Short date (9/10/2025)
• D → Long date (Wednesday, September 10, 2025)
• t → Short time (8:45 PM)
• T → Long time (08:45:00 PM)
• f → Full date + short time
• F → Full date + long time
• g → General date/time short
• G → General date/time long
• M → Month/day (September 10)
• Y → Year/month (September 2025)
• O → ISO 8601 format
• U → Universal UTC format

Practical GridView Example with All Formats

Here’s a full GridView example that shows numbers, dates, and percentages with formatting:

<asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="False">
    <Columns>
        <!-- Currency -->
        <asp:TemplateField HeaderText="Pay Amount">
            <ItemTemplate>
                <asp:Label ID="lblPayAmount" runat="server" 
                           Text='<%# Eval("PayAmount", "{0:C}") %>'></asp:Label>
            </ItemTemplate>
        </asp:TemplateField>

        <!-- Date -->
        <asp:TemplateField HeaderText="Payment Date">
            <ItemTemplate>
                <asp:Label ID="lblPayDate" runat="server" 
                           Text='<%# Eval("PayDate", "{0:MMM dd, yyyy}") %>'></asp:Label>
            </ItemTemplate>
        </asp:TemplateField>

        <!-- Percentage -->
        <asp:TemplateField HeaderText="Discount">
            <ItemTemplate>
                <asp:Label ID="lblDiscount" runat="server" 
                           Text='<%# Eval("Discount", "{0:P2}") %>'></asp:Label>
            </ItemTemplate>
        </asp:TemplateField>
    </Columns>
</asp:GridView>

Tips and Best Practices

• Always choose a format that matches the data type.
• Be mindful of culture/localization (currency symbols and date formats may change by region).
• Use BoundField with DataFormatString if you don’t need a TemplateField.

<asp:BoundField DataField="PayAmount" HeaderText="Pay Amount" 
                DataFormatString="{0:C}" HtmlEncode="false" />

Frequently Asked Questions (FAQ)

1. How do I format numbers in ASP.NET GridView?

• You can format numbers using the Eval method with a format string. For example:
  <%# Eval("Amount", "{0:N2}") %>
  This displays numbers with two decimals and thousands separator (e.g., 1,350.30).

2. How do I display currency format in GridView?

• Use the currency format specifier (C):
  <%# Eval("Price", "{0:C}") %>
  If the value is 1350.3, it will display as $1,350.30 (based on system culture).

3. How do I format date in GridView?

• You can display dates in a friendly format using format strings:
  <%# Eval("PaymentDate", "{0:MMM dd, yyyy}") %>
  If the value is 2025-09-10, it will display as Sep 10, 2025.

4. How do I show time in GridView?

• For 12-hour time with AM/PM:
  <%# Eval("StartTime", "{0:hh:mm tt}") %>
• For 24-hour format:
  <%# Eval("StartTime", "{0:HH:mm}") %>

5. Can I apply custom format in GridView?

• Yes. For example, you can display percentages with custom decimals:
  <%# Eval("Discount", "{0:0.00}%") %>
  If the value is 0.235, it shows as 0.24%.

6. What is the difference between TemplateField and BoundField in GridView?

• TemplateField → More flexible; lets you use custom controls like Label or HyperLink.
• BoundField → Simpler; you can apply DataFormatString directly:

  
  <asp:BoundField DataField="PayAmount" HeaderText="Pay Amount" 
                  DataFormatString="{0:C}" HtmlEncode="false" />
  

Conclusion

Formatting data in ASP.NET GridView makes your application look professional and user-friendly.

• Use number format in GridView for amounts, currency, and percentages.
• Use date format in GridView and time format in GridView for clear date/time display.
• Apply custom format in GridView when you need more control.
• Remember that ASP.NET formatting uses the powerful .NET standard format specifiers.

By applying the right GridView data format, your tables will be cleaner, easier to read, and much more user-friendly.

If you found this article helpful, don’t forget to share it with your developer community!