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. (Last updated on: June 24, 2019).
Unfortunately, activation email could not send to your email. Please try again.
Syncfusion Feedback

European date format

Thread ID:

Created:

Updated:

Platform:

Replies:

147089 Aug 31,2019 09:33 PM UTC Oct 11,2019 09:33 AM UTC Blazor 9
loading
Tags: Grid
Ivan Petrov
Asked On August 31, 2019 09:33 PM UTC

Hello,

Could you tell me how I can set the format of the date picket to be European. For example, instead of 08/23/1999 I would like 23.08.1999 or 23/08/1999. Thank you in advance!

Berly Christopher [Syncfusion]
Replied On September 2, 2019 12:04 PM UTC

Hi Krasimir, 
  
  
Greetings from Syncfusion support. 
  
  
We can achieve your requirement by set the date format as “dd.MM.yyyy” or “dd/MM/yyyy” for the Format property to display the date value as “23.08.1999” and “23/08/1999” as mentioned in the below code example.  
  
 
<b>Datepicker with Format:</b> dd/MM/YYYY 
<div><EjsDatePicker Format="dd/MM/yyyy" Width="250px"></EjsDatePicker></div> 
<b>Datepicker with Format:</b> dd.MM.YYYY 
<div><EjsDatePicker Format="dd.MM.yyyy" Width="250px"></EjsDatePicker></div> 
 
  
To know more about format, please refer the below UG documentation link. 
 
 
 
  
Else, we can set the locale based on your requirement as mentioned in the below Globalization UG documentation link. So, that DatePicker will be rendered with corresponding date format of the loaded locale. 
 
  
  
Regards, 
Berly B.C 


Tsvetan
Replied On September 3, 2019 07:22 AM UTC

Hello Berly,

What about when the date is a column in the Grid. For example:

<GridColumn Field="CreatedOn" HeaderText="Created On" Format="dd/MM/yyyy" Type="date" AllowGrouping="false"></GridColumn>

The date that is displayed is not in this format, but like this Tue Sep 03 2019 07:00:46 GMT+0300 (Eastern European Summer Time)
 
The only format that seems to atleast make some formating is yMd, but the result is 8/22/2019, which is still not correct, if it was working correctly it should be 
something like 2019/8/22

Kind Regards,
Tsvetan

Renjith Singh Rajendran [Syncfusion]
Replied On September 4, 2019 05:40 AM UTC

Hi Tsvetan, 
  
Thanks for contacting Syncfusion support. 
  
We suggest you to load the corresponding culture’s CLDR data files to apply the corresponding date format for the date columns in Grid. Please load the following CLDR data files using “LoadCldrData” function for cultures other than “en-US”. 
  
File Name 
Path 
ca-gregorian 
cldr/main/en/ca-gregorian.json 
timeZoneNames 
cldr/main/en/timeZoneNames.json 
numbers 
cldr/main/en/numbers.json 
numberingSystems 
cldr/supplemental/numberingSystems.json 
currencies 
cldr/main/en/currencies.json 
  
In the below code we have loaded the “de” culture files. Please use the code below to load the corresponding cultures CLDR data files. 
  
  
@using Microsoft.JSInterop 
@using Syncfusion.EJ2.Blazor.Grids 
  
<EjsGrid DataSource="@Orders" AllowSorting="true" AllowPaging="true" AllowGrouping="true"> 
    <GridColumns> 
        ... 
        <GridColumn Field=@nameof(Order.OrderDate) HeaderText=" Order Date" Format="yMd" Type="ColumnType.Date" TextAlign="TextAlign.Right" Width="130"></GridColumn> 
   </GridColumns> 
</EjsGrid> 
 
@code{ 
    [Inject] 
    IJSRuntime JsRuntime { get; set; } 
    EjsGrid<Order> gridInstance; 
    ... 
    protected override void OnAfterRender() 
    { 
       this.JsRuntime.Ejs().LoadLocaleData("wwwroot/de.json").LoadCldrData(new string[] { "wwwroot/scripts/cldr-data/main/de/currencies.json", "wwwroot/scripts/cldr-data/main/de/numbers.json", "wwwroot/scripts/cldr-data/main/de/ca-gregorian.json", "wwwroot/scripts/cldr-data/main/de/timeZoneNames.json""wwwroot/scripts/cldr-data/supplemental/numberingSystems.json" }).SetCulture("de").SetCurrencyCode("EUR"); 
    } 
} 
  
  
  
For your convenience we have created the sample using the “de” culture to apply the date format for the date columns based on the corresponding culture. Please download the sample from the below link, 
 
Please get back to us if you need further assistance. 
  
Regards, 
Renjith Singh Rajendran. 


Ivan Petrov
Replied On September 4, 2019 04:58 PM UTC

Hello, 
Could you possibly add it as a grid feature that you can just specify the format like in the date picker component so in this way we shouldn't have to load scripts? Thank you in advance! :)

Renjith Singh Rajendran [Syncfusion]
Replied On September 5, 2019 09:06 AM UTC

Hi Krasimir,
We can achieve this requirement, without loading any culture files or apply Globalization in Grid by using the “Custom Format feature for Blazor Grid”. But currently, we don’t have support to apply custom format for Syncfusion Blazor Grid. So we have logged this as a feature task and added to our feature request list.  
 
We have planned to implement this feature in our subsequent Nuget release which is expected to be roll out on or before September 13,  2019 
 
You can now track the current status of your request, review the proposed resolution timeline, and contact us for any further inquiries through this link.  

Please get back to us if you need further assistance. 

Regards, 
Renjith Singh Rajendran. 


Renjith Singh Rajendran [Syncfusion]
Replied On September 18, 2019 12:45 PM UTC

Hi Krasimir, 
  
We regret for the inconvenience caused.  
  
Due to some unforeseen circumstances, we will not be able to include this feature “Custom Format feature for Blazor Grid” in our upcoming Nuget release. But we will implement this feature and this will be included in our subsequent Nuget release which is expected to be rolled out in the first week of October 2019.  
  
Until then we appreciate your patience. 
  
Regards, 
Renjith Singh Rajendran. 


Ivan Petrov
Replied On October 9, 2019 07:22 PM UTC

Hello,
has changing date formats in the grid been added as a feature yet?

Renjith Singh Rajendran [Syncfusion]
Replied On October 10, 2019 06:20 AM UTC

Hi Krasimir, 

We regret for the inconvenience caused.  

Due to some complexities we are facing from our side to implement this feature, we could not include this feature “Custom Format feature for Blazor Grid” in our latest Nuget release. But we will implement this feature and this will be included in our subsequent bi-weekly Nuget release which is expected to be rolled out on or before 16th October 2019.  

Until then we appreciate your patience. 

Regards, 
Renjith Singh Rajendran. 


Renjith Singh Rajendran [Syncfusion]
Replied On October 11, 2019 09:33 AM UTC

Hi Krasimir,  

We are glad to inform you that our latest Nuget package (17.3.0.17) has been successfully rolled out. In this release, we have included the feature “Custom Format Support for Blazor Grid”. Please find the latest Nuget package from the link below, 

 
 
Also ensure to refer the latest version script and css in your application.  
 
     
    <link rel='nofollow' href="https://cdn.syncfusion.com/ej2/17.3.17/fabric.css" rel="stylesheet" /> 
 
 
Please use the below code to apply custom format for Grid columns. 
 
 
<GridColumn Field=@nameof(Order.OrderDate) HeaderText="Order Date" CustomFormat="@(new { type ="date", format="dd.MM.yyyy" })" Type="ColumnType.Date"> 
 
 
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. 
 
Format 
Formatted value 
{ type=”date”, format=”dd/MM/yyyy”} 
04/07/1996 
{ type=”date”, format=”dd.MM.yyyy” } 
04.07.1996 
{ type=”date”, skeleton=”short” } 
7/4/96 
{ 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 
 
 
Please get back to us if you need further assistance. 

Regards, 
Renjith Singh Rajendran. 



CONFIRMATION

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