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

Grid Column Format Issue

Thread ID:





140663 Oct 31,2018 10:29 AM UTC Sep 24,2019 10:45 AM UTC ASP.NET MVC - EJ 2 5
Tags: Grid
Asked On October 31, 2018 10:31 AM UTC


I can not find any information to solve the problem below.

When i use Format("") with my columns, this procudes no effet.

Here's the cshtml overview:

                              DataSource(dataManager => { dataManager.Url(dataManagerUrl).Adaptor("UrlAdaptor"); })
                                .Columns(col =>
                                    col.Field("issueDate").Format("{0:MM/dd/yyyy}").HeaderText("Issue Date").Add();

But in grid, issueDate display "Sun Nov 05 2017 00:00:0" and grandTotalAmount display "530".

Here's the return json overview :

{"invoiceNumber":"FA-2017-0009","issueDate":"2017-11-05T00:00:00", "grandTotalAmount":530.0000}

Can you help me ?

My EJ2 MVC versions : Syncfusion.EJ2.JavaScript + Syncfusion.EJ2.MVC5



Mohammed Farook J [Syncfusion]
Replied On October 31, 2018 01:12 PM UTC

Hi Jean, 
Thanks for contacting Syncfusion support. 
We have validated the provided code example  and please find the code example for set the format of date column. 
  @Html.EJS().Grid("DefaultFunctionalities").DataSource((IEnumerable<object>)ViewBag.dataSource).Columns(col=> { 
       col.Field("OrderID").HeaderText("Order ID").TextAlign(Syncfusion.EJ2.Grids.TextAlign.Right).Width("120").Add(); 
       col.Field("CustomerID").HeaderText("Customer Name").Width("150").Add(); 
       col.Field("OrderDate").HeaderText("Order Date").TextAlign(Syncfusion.EJ2.Grids.TextAlign.Right).Width("130").Format("yMd").Add(); 
       col.Field("ShippedDate").HeaderText("Shipped Date").Width("140").Format("yMd").Add(); 
       col.Field("ShipCountry").HeaderText("Ship Country").Width("150").Add(); 
If you want to display the custom format for date column, We suggest you to set the format and type for the particular date column inside the load event of Grid. Please refer the code example below,   
@Html.EJS().Grid("Grid").Load("load" ).DataSource((IEnumerable<object>)ViewBag.datasource).Columns(col =>   
   col.Field("ShippedDate").HeaderText("Ship Date").Width("150").Add();   
}).AllowPaging().EditSettings(edit => { edit.AllowAdding(true).AllowEditing(true).AllowDeleting(true).Mode(Syncfusion.EJ2.Grids.EditMode.Normal); }).Render()   
    function load(args) {   
        //Here OrderDate is the 3rd column   
        this.columns[3].format = { type: 'date', format: 'dd/MM/yyyy' };   
Documentation :   
J Mohammed Farook  

Replied On October 31, 2018 02:09 PM UTC

Thanks for your quick reply! But, i'm not sure to understand if we can really use Format("yMd").  or if  we have to hack with using  Load js function  instead.

(Because Format("yMd").  doesn't do anything in my code)



Mohammed Farook J [Syncfusion]
Replied On November 1, 2018 11:53 AM UTC

Hi Jean, 
We are tried to reproduce the reported issue but it was unsuccessful at our end.  So we have prepared the sample with your requirement and that sample can be downloadable from the below link, 
In this sample we have used both formats (i.e default and custom date format) in date column. 
We have found from your update, you have used older version of EJ2 Grid. Could you please update the EJ2 Grid latest version (v16.3.29).  
Please find the CDN link for latest EJ2 latest scripts and styles 
@* Syncfusion Essential JS 2 Styles *@ 
<link rel="stylesheet" rel='nofollow' href="https://cdn.syncfusion.com/ej2/material.css" /> 
@* Syncfusion Essential JS 2 Scripts *@ 
<script src="https://cdn.syncfusion.com/ej2/dist/ej2.min.js"></script> 
If you still facing the same issue, please ensure and share the following details to us for further assistance, 
  1. Share the grid full code example
  2. Ensure date column values are in which type (i.e date object or string). If the values are not in date object, then this format property will not work.
  1. If possible try to reproduce the issue in our attached sample and send back to us.
J Mohammed Farook.  

Replied On September 23, 2019 09:36 AM UTC

same issues
 grandTotalAmount display "530".

Here's the return json overview :

{"invoiceNumber":"FA-2017-0009","issueDate":"2017-11-05T00:00:00", "grandTotalAmount":530.0000}

Can you help me ?

Seeni Sakthi Kumar Seeni Raj [Syncfusion]
Replied On September 24, 2019 10:45 AM UTC

We suspect that you are missing the type to the Grid columns as ‘date’ as well as set the required format. Refer to the following Help Document on the formatting.  
@Html.EJS().Grid("Format").DataSource((IEnumerable<object>)ViewBag.DataSource).Columns(col => 
              . . . 
    col.Field("OrderDate").HeaderText("Order Date").TextAlign(Syncfusion.EJ2.Grids.TextAlign.Right).Type("date").Add(); 
<script>    function load(args) {        this.columns[2].format = {type: ‘date’: format: ‘dd/MM/yyyy’}    }</script>
Seeni Sakthi Kumar S 


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