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
close icon

Date format

I'm setting the grid datasource with ajax call to the controller JsonResult action which returns
new CustomJsonResultNoDateHour { Data = PolLista.ToList() };
because of the date fields.

Internal class is like this:

internal class CustomJsonResultNoDateHour : JsonResult
        {
            private const string _dateFormat = "yyyy-MM-dd";

            public override void ExecuteResult(ControllerContext context)
            {
                if (context == null)
                {
                    throw new ArgumentNullException("context");
                }

                HttpResponseBase response = context.HttpContext.Response;

                if (!String.IsNullOrEmpty(ContentType))
                {
                    response.ContentType = ContentType;
                }
                else
                {
                    response.ContentType = "application/json";
                }
                if (ContentEncoding != null)
                {
                    response.ContentEncoding = ContentEncoding;
                }
                if (Data != null)
                {
                    var isoConvert = new IsoDateTimeConverter();
                    isoConvert.DateTimeFormat = _dateFormat;
                    response.Write(JsonConvert.SerializeObject(Data, isoConvert));
                }
            }
        }

But how can I change the format in the grid column? If I set it like this:
col.Field("DatumOd").HeaderText("Početak").Format("{0:dd.MM.yyyy.}").Width(100).Add();

it's still displays



but if I export it to the excel...I got this:



So, the export format is OK, but the display in the column is not.

If I change the format in the internal class to this:
private const string _dateFormat = "yyyy-MM-dd";

then th display in the grid is OK, but when I want to export it to excel,
the error says "the value 19.02.2019. is not valid for the datetime".

Any idea how to handle this?
Thanks.

Bernard.

3 Replies

VN Vignesh Natarajan Syncfusion Team May 8, 2019 05:57 AM UTC

Hi Bernard, 
 
Thanks for contacting Syncfusion forums. 
 
Query: “But how can I change the format in the grid column? If I set it like this: 
 
From your query, we understand that you are facing issue while defining the format for the data column. We have analyzed the provided code example and we suspect that you are using JSON.parse() method to serialize the string to object while updating the dataSource of the Grid. So while serializing the string using JSON.parse(), date value is converted to string. Hence the format is not applied properly.  
 
To overcome the reported issue, we suggest you to use any one of the following methods. 
 
  1. Define Type as date for the date columns.
 
@(Html.EJ().Grid<Object>("Grid") 
      .Datasource((IEnumerable<Object>)ViewBag.dataSource) 
      .ToolbarSettings(toolBar => toolBar.ShowToolbar().ToolbarItems(items => 
       { 
        items.AddTool(ToolBarItems.ExcelExport); 
        items.AddTool(ToolBarItems.WordExport); 
        items.AddTool(ToolBarItems.PdfExport); 
        })) 
       .Columns(col => 
       { 
        col.Field("payment_date").HeaderText("Početak").Format("{0:dd.MM.yyyy.}").Type("date").Width(100).Add(); 
        col.Field("fund_amt").HeaderText("Amount Invested").Format("{0:n0}").TextAlign(TextAlign.Right).Add(); 
        col.Field("commision_items_value").HeaderText("Commission Entitlement").Format("{0:p0}").TextAlign(TextAlign.Right).Add(); 
        col.Field("amt").HeaderText("Profit Bonus").Format("{0:n0}").TextAlign(TextAlign.Right).Add(); 
        col.Field("currentcy_Code").HeaderText("Currency").TextAlign(TextAlign.Right).Add(); 
        }) 
        .ClientSideEvents(eve => { eve.QueryCellInfo("formatingCell"); }) 
) 
 
  1. Or use ej.parseJSON to serialize the string to object before binding to Grid.
 
<button id="Btn" onclick="data()">Data Bind</button> 
@(Html.EJ().Grid<Object>("Grid") 
      ………………………………………………………….. 
        .ClientSideEvents(eve => { eve.QueryCellInfo("formatingCell"); }) 
) 
<script type="text/javascript"> 
    function data() { 
        $.ajax({ 
            url: "@(Url.Action("UseShippingAddress", "Grid"))", 
            type: "POST", 
            data: { id: 50 }, 
            cache: false, 
            async: true, 
            success: function (data) { 
                var Obj = $("#Grid").ejGrid("instance"); 
                Obj.dataSource(ej.parseJSON(data));              
            } 
        }); 
    }; 
</script> 
 
We have ensured the both the solution and it works as expected (i.e) format is applied properly to date column in Grid as well as exported excel sheet.  
 
If you are still facing the issue, kindly share the following details. 
 
  1. Share the details how you are binding the data to Grid.
  2. Share the data from the server (response tab of network window).
  3. Share the screenshot of script error in console window (if any).
 
Requested details will be helpful for us to validate the reported issue at our end. 
 
Regards, 
Vignesh Natarajan.  
 
 



BJ Bernard Jurlina May 8, 2019 09:14 PM UTC

Thanks Vignesh,

it's working.

Regards!
Bernard.


VN Vignesh Natarajan Syncfusion Team May 9, 2019 03:37 AM UTC

Hi Bernard,  
 
Thanks for the acknowledgement. 
 
We are glad to hear that your query has been resolved by our solution.  
 
Please get back to us if you have further queries. 
 
Regards, 
Vignesh Natarajan.  


Loader.
Live Chat Icon For mobile
Up arrow icon