We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy. Image for the cookie policy date
Unfortunately, activation email could not send to your email. Please try again.
Syncfusion Feedback

How to get european formated date in Blazor grid column

Thread ID:





148468 Oct 21,2019 12:48 PM UTC Oct 23,2019 05:43 AM UTC Blazor 3
Tags: Grid
Asked On October 21, 2019 12:48 PM UTC


Could you tell me how I can set the format of a date column to be European. For example, instead of 10/21/2019 I would like to have 21/10/2019. 

I tried with this instruction
 <GridColumn Field="Date" HeaderText="Date" Format="dd/MM/yyyy" Type="ColumnType.Date"  ></GridColumn>

and it doesn't work. The only format which seams working is "yMd" with result as "MM/dd/yyyy"

I tried also with a templated column

            <GridColumn HeaderText="Date" Width="80">
                        WeatherForecast Value = (context as WeatherForecast);

I get the wished result with the 2nd option but I don't know how to sort the column after that.

Thank you in advance!

Renjith Singh Rajendran [Syncfusion]
Replied On October 22, 2019 06:37 AM UTC

Hi Patrick, 

Thanks for contacting Syncfusion support. 

Query 1 : how I can set the format of a date column to be European 
We suggest you to use the “Custom Format feature of Grid”. Please use the below code to apply custom format for Grid columns. 
   <GridColumn Field=@nameof(Order.OrderDate) CustomFormat="@(new { type= "date", format= "dd/MM/yyyy" })" Type="ColumnType.Date" ...></GridColumn> 
You can use custom format string to format the date values. Some of the custom formats and the formatted date values are given in the below table. 
Formatted value 
{ type=”date”, format=”dd/MM/yyyy”} 
{ type=”date”, format=”dd.MM.yyyy” } 
{ type=”date”, skeleton=”short” } 
{ type=”dateTime”, format= ”dd/MM/yyyy hh:mm a” } 
04/07/1996 12:00 AM 
{ type= “dateTime”, format= “MM/dd/yyyy hh:mm:ss a” } 
07/04/1996 12:00:00 AM 
Query 2 : but I don't know how to sort the column after that. 
If you want to apply sorting for a template column. Then we suggest you to define the “Field” property for that column. Please use the code below, 
        <GridColumn Field="Date" HeaderText="Date" Width="80"> 
                    WeatherForecast Value = (context as WeatherForecast); 
Please get back to us if you need further assistance. 

Renjith Singh Rajendran. 

Replied On October 22, 2019 09:44 AM UTC

Hi Renjith,

Thank you very much for your very quick and professional answer.

Everything is working perfectly but...
I have a side effect on the sorting process: for my test I have 2 columns each with the field "date" 
  • one with the customformat 
  • and a second with a templated value

When I click on the first, it's going well
but when I click on the last one, the sort is mentionned on the first column and not on the last one.

It's not very important, but I would like to mention it.

Thank you for your support.

Vignesh Natarajan [Syncfusion]
Replied On October 23, 2019 05:43 AM UTC

Hi Patrick,  

Thanks for the acknowledgement.  

Query: “I have a side effect on the sorting process: for my test I have 2 columns each with the field "date"  
EjsGrid column must have unique Field value. Two columns cannot have same Field value otherwise we will face issue while performing each and every action like filtering, sorting, grouping, CRUD etc. Because we have performed all these Grid actions based on Field value only. 

In our previous update, we have provided two solutions (customFormat and Template column with Field value) to achieve your requirement. So kindly use any one of the previously suggested solution for your requirement.  

Please get back to us if you have further queries.   

Vignesh Natarajan.  


This post will be permanently deleted. Are you sure you want to continue?

Sorry, An error occured while processing your request. Please try again later.

Please sign in to access our forum

This page will automatically be redirected to the sign-in page in 10 seconds.

Warning Icon You are using an outdated version of Internet Explorer that may not display all features of this and other websites. Upgrade to Internet Explorer 8 or newer for a better experience.Close Icon

Live Chat Icon For mobile
Live Chat Icon