Format Date

[nimue]

How can I Format the date column in a Grid in Italian Format?

Tank you for your support.

[Renjith Singh Rajendran]

Hi Inzitari, 

Thanks for contacting Syncfusion support. 

We have analyzed your query. We have set Italian culture for the Grid using the Locale property of Grid. We have loaded the necessary cldr-data JSON files to display the Italian date format by using an ajax, we suggest you to use the below code to load the cldr-data files, 

[Index.cshtml] 

 

@Html.EJS().Grid("GridJ2").DataSource((IEnumerable<object>)ViewBag.datasource).AllowGrouping(true).Locale("it").Columns(col => 

{ 

   ... 

  col.Field("OrderDate").HeaderText("Order Date").TextAlign(Syncfusion.EJ2.Grids.TextAlign.Right).Width("100").Format("yMd").Add(); 

}).Render() 

 

[_Layout.cshtml] 

 

    <script> 

 

        function loadCultureFiles(name) { 

            var files = ['ca-gregorian.json', 'numbers.json', 'timeZoneNames.json', 'currencies.json']; 

            var loadCulture = function (prop) { 

                var val, ajax; 

                ajax = new ej.base.Ajax(location.origin + '/../../scripts/cldr-data/main/' + name + '/' + files[prop], 'GET', false); 

                ajax.onSuccess = function (value) { 

                    val = value; 

                }; 

                ajax.send(); 

                ej.base.loadCldr(JSON.parse(val)); 

                ej.base.setCulture('it'); 

                ej.base.setCurrencyCode('EUR'); 

            }; 

            for (var prop = 0; prop < files.length; prop++) { 

                loadCulture(prop); 

            } 

        } 

 

        document.addEventListener('DOMContentLoaded', function () { 

            loadCultureFiles('it'); 

        }); 

 

    </script> 

Note : Provide the correct path in the ajax to fetch the cldr-data JSON files. Here I have moved the cldr-data folder from the node_modules to the script folder. 

Sample : http://www.syncfusion.com/downloads/support/directtrac/general/ze/SyncfusionMvcApplication7-693709762 

 

Please get back to us if you need further assistance. 

Regards, 

Renjith Singh Rajendran. 

[nimue]

Hi Renjith Singh Rajendran

Tanks for the support: now I can see the dates in the italian format.

However, opening the developer console I get a warning which I enclose a screenshot.

can you help me?

Thanks again

Barbara Inzitari

 

Attachment: Warning_9c718b0a.zip

[Renjith Singh Rajendran]

Hi Inzitari, 

We have analyzed the reported query. We suggest you to use asynchronous Ajax request to the server to overcome the warning. Please refer the code example below, 

    <script> 

        function loadCultureFiles(name) { 

            ... 

            var loadCulture = function (prop) { 

                ... 

                ajax = new ej.base.Ajax(location.origin + '/../../scripts/cldr-data/main/' + name + '/' + files[prop], 'GET', true);  

                ajax.onSuccess = function (value) { 

                    val = value; 

                    ej.base.loadCldr(JSON.parse(val)); 

                }; 

                ... 

            }; 

            ... 

   </script> 

Documentation : https://ej2.syncfusion.com/16.1.37/documentation/base/api-ajax.html?lang=typescript 

 

We have also modified the sample from our previous update. Please download it from the link below, 

Sample : http://www.syncfusion.com/downloads/support/directtrac/general/ze/SyncfusionMvcApplication7580665945 

 

Please get back to us if you need further assistance. 

Regards, 

Renjith Singh Rajendran. 

[nimue]

Hi Renjith

Thank you for your answer.

I modified the code as you advised me and now everything is fine.

thank you for your support.

Best regards

Barbara Inzitari

[Renjith Singh Rajendran]

Hi Inzitari, 

Thanks for the update. 

We are happy to hear that your requirement has been achieved.  

Please get back to us if you need further assistance. 

Regards, 

Renjith Singh Rajendran.