Problem formatting date value in grid

[Juan José]

Hi,

I have a grid:

@Html.EJS().Grid("grdBeneficiarios").DataSource(dataManager => { dataManager.Json(Model.ToArray()).InsertUrl("/Contrato/AgregarBeneficiario").RemoveUrl("/Contrato/EliminarBeneficiario").UpdateUrl("/Contrato/ActualizarBeneficiario").Adaptor("RemoteSaveAdaptor");}).ActionBegin("actionBegin").Columns(col =>
{
    col.Field("IdBeneficiario").IsPrimaryKey(true).IsIdentity(true).Visible(false).Add();
    col.Field("IdTiposIdentificacion").HeaderText("Tipo id").ForeignKeyField("IdTiposIdentificacion").ForeignKeyValue("Nombre").DataSource((List<TipoIdViewModel>)PersonaServices.GetTiposId()).Add();
    col.Field("NumeroId").HeaderText("Numero id").Add();
    col.Field("PrimerNombre").HeaderText("Primer nombre").Visible(false).Add();
    col.Field("SegundoNombre").HeaderText("Segundo nombre").Visible(false).Add();
    col.Field("PrimerApellido").HeaderText("Primer apellido").Visible(false).Add();
    col.Field("SegundoApellido").HeaderText("Segundo apellido").Visible(false).Add();
    col.Field("NombreCompleto").HeaderText("Nombre").Add();
    col.Field("TelefonoMovil").HeaderText("Celular").Add();
    col.Field("Email").HeaderText("Email").Add();
    col.Field("IdSede").HeaderText("Sede").ForeignKeyField("IdSede").ForeignKeyValue("Nombre").DataSource((List<SedeViewModel>)ContratoServices.GetSedes().FindAll(s => s.Habilitado)).Add();
    col.Field("WelcomeDay").HeaderText("Welcome day").Format("MM/dd/yyyy hh:mm").EditType("datetimepickeredit").Add();
    col.Field("Observaciones").HeaderText("Obs").Add();
    col.HeaderText("Enviar email").Width("160").Commands(comandos).Add();
    col.Field("IdContrato").Visible(false).Add();
}).Locale("es-CO").DataBound("dataBind").Load("load").EditSettings(edit => { edit.AllowAdding(true).AllowEditing(true).AllowDeleting(true).Mode(Syncfusion.EJ2.Grids.EditMode.Dialog); }).Toolbar(toolbarItems).Render()

But no data is displayed, except when I delete the .Format option for the "WelcomeDay" column. The problem is that the value showed is: 

Fri Mar 22 2019 09:00:00 GMT-0500 (hora estándar de Colombia)

is too long!.

[Madhu Sudhanan P]

Hi Juan, 

Thanks for contacting Syncfusion support. 

You need to format the date value as follows with your own format value. 

col.Field("WelcomeDay").HeaderText("Welcome day").Format(new { type = "dateTime", format="MM/dd/yyyy hh:mm"}) 

.EditType("datetimepickeredit").Add(); 

Please refer to the below documentation link. 

https://ej2.syncfusion.com/aspnetmvc/documentation/grid/columns/#date-formatting 

Regards, 

Madhu Sudhanan P 

[Juan José]

Hi,

Thanks so much. Now it is working but, now I have the same problem with the grid using Javascript.

My code is like the sample in documentation in https://ej2.syncfusion.com/javascript/documentation/grid/columns/#date-formatting :

columns: [

                    { field: "IdBeneficiario", isPrimaryKey: true, isIdentity: true, visible: false },

                    { field: "NumeroId", headerText: "Numero id" },

                    { field: "PrimerNombre", headerText: "Primer nombre", visible: false },

                    { field: "SegundoNombre", headerText: "Segundo nombre", visible: false },

                    { field: "Email", headerText: "Email" },

                    { field: "WelcomeDay", headerText: "Welcome day", format:{ type:"dateTime", format:"yyyy/MM/dd hh:mm a" }, editType: "datetimepickeredit"},

                ]

            });

            grid.appendTo("#grdBeneficiarios");

With the format included, no rows are shown but, if I delete the format, all rows are shown

I don´t know what is wrong, I am writting in the same way as the sample in documentation.

Thanks for your help,

Kind regards,

Juan.

[Pavithra Subramaniyam]

Hi Juan, 

Thanks for your Update. 

We have analyzed your query but we are unable to reproduce the reported issue at our end. So please provide the below information for us, it will help us provide a better solution as soon as possible, 

1. Please share the Sample data of your Grid.
2. Please share you full grid code sample?
3. Please share grid package version details?
4. Could you please try to reproduce the reported issue in the below provided sample?
5. Please try to bind ‘actionFailure’ event in Grid and share the argument of that event

Sample: https://stackblitz.com/edit/hp1ghs-qdcnew?file=index.js  

Please get back to us for further assistance. 

 

Regards, 

Pavithra S. 

 

[Juan José]

Hi,

I am still facing this issue with javascript.

I am attaching the info requested:

DataSource.PNG shows the data used to feed the grid.

actionFailure.PNG shows the action failure args.

GridCode.txt has the whole grid code.

Thanks for your help, kind regards

Juan J.

Attachment: FormatDate_d6193346.zip

[Hariharan J V]

Hi Juan, 

Thanks for the provided details. 

From your screenshot, we found that date column value is in JSON string format. But it is necessary to provide the JSON data to JsonAdaptor instead of this JSON string. So we suggest to parse this JSON string to JSON data before providing it to Grid. Please refer the following code snippet, 

var data = new ej.data.DataManager(window.orderData).executeLocal(new ej.data.Query().take(15)); 

    var grid = new ej.grids.Grid({ 

        dataSource: ej.data.DataUtil.parse.parseJson(data), 

         

        ... 

 

   }); 

    grid.appendTo('#Grid'); 

Regards, 

Hariharan 

[Juan José]

Thanks so much, it is woring now.

Kind regards,

Juan J.

[Hariharan J V]

Hi Juan, 

 

Thanks for your update.  

  

We are happy to hear that the provided solution helped you.   

  

Please contact us if you need any further assistance. As always, we will be happy to assist you.   

  

Regards, 

Hariharan