This is a migrated thread and some comments may be shown as answers.

Grid model json date is invalid

16 Answers 68 Views
Grid
This is a migrated thread and some comments may be shown as answers.
FranckSix
Top achievements
Rank 1
Veteran
FranckSix asked on 18 Jan 2021, 08:49 PM

My model like this

public class MyViewModel
{
   public int Id { get; set; }
 
   [DataType(DataType.Date)]
   public DateTime ApplicationDate { get; set; }
}

 

My View like this

.DataSource(d => d
     .Custom()
     .Type("aspnetmvc-ajax")
     .Batch(true)
     .Schema(s => s
         .Model(m => m.Id(p => p.ProductID));
         .Data("Data");
         .Total("Total");
         .Errors("Errors"))
    .Transport(transport => t
        .Read(r => r.Action("GetData", "Controller", new { IdClient = Model.Client.Id })
        .Submit("onSubmit")))
 

And finally my javascript block

function onSubmit (e) {
   var myData = e.data.created[0];
}

 

And the is the hic! myData like this

{
   Id: 0,
   ApplicationDate: Tue Apr 26 2016 00:00:00 GMT-0400 (heure d’été de l’Est)
}

 

Yes the quotes is missing in the output format. And the model is not valid. I set format on both DataSource.Shema.Model.Field.Format and Column.Bound.Format  to "yyyy-MM-dd" and it still return JSON on incorrect format.

Does it possible to set Kendo to use ISO8601 instead of the JavasCrap Format ?

16 Answers, 1 is accepted

Sort by
0
Nikolay
Telerik team
answered on 20 Jan 2021, 11:16 AM

Hi Francis,

Thank you for sharing the code snippets with me.

Could you elaborate by sharing more details on the case?

- Is the DataSource bound to a Kendo UI Grid?

- Where is the Submit event declared? Is the Grid inside a form? The DataSource component does not expose a Submit event.

In general, the easiest way to convert a Date object to the desired ISO 8601 format is to call the toJSON() method.

Let me know if this helps.

Regards,
Nikolay
Progress Telerik

Virtual Classroom, the free self-paced technical training that gets you up to speed with Telerik and Kendo UI products quickly just got a fresh new look + new and improved content including a brand new Blazor course! Check it out at https://learn.telerik.com/.

0
FranckSix
Top achievements
Rank 1
Veteran
answered on 20 Jan 2021, 01:20 PM

Hi,

Yes the DataSource is used in a Kendo Grid defined in a form with Asp.Net MVC.

The submit event is called by the form.sumbit

Thanks for help

0
FranckSix
Top achievements
Rank 1
Veteran
answered on 20 Jan 2021, 01:35 PM

Hi,

Forgot previous post, here is my save action function

$("#zoneDetail")
   .on("click", "a.icon-bouton#Save",
      function () {
         const grid = $("#MyGrid").data("kendoGrid");
         grid.saveChanges();
      });
0
FranckSix
Top achievements
Rank 1
Veteran
answered on 21 Jan 2021, 03:36 PM

I found a way to do map in correct way. I share my solution

first I create two HtmlHelper for map my date in grid

public static GridBoundColumnBuilder<TModel> BoundDate<TModel>(this GridColumnFactory<TModel> gcf, Expression<Func<TModel, DateTime>> expression, string format) where TModel : class
   {
      if (gcf is null) throw new ArgumentNullException(nameof(gcf));
 
      var property = ((MemberExpression)expression.Body).Member;
      return gcf.Bound(expression).Template(t => "@<text></text>").ClientTemplate($"#=kendo.toString(kendo.parseDate({property.Name}),'{format}')#");
   }
 
public static GridBoundColumnBuilder<TModel> BoundDate<TModel>(this GridColumnFactory<TModel> gcf, Expression<Func<TModel, DateTime?>> expression, string format) where TModel : class
   {
      if (gcf is null) throw new ArgumentNullException(nameof(gcf));
 
      var property = ((MemberExpression)expression.Body).Member;
 
      return gcf.Bound(expression).Template(t => "@<text></text>").ClientTemplate($"#= {property.Name} ? kendo.toString(kendo.parseDate({property.Name}),'{format}') : '' #");
   }

 

after I can do this

.Columns(c =>
   {
      c.Bound(p => p.Id).Visible(false);
      c.BoundDate(p => p.ApplicationDate, "yyyy-MM-dd");
   }

and for get the correct format on my post method on the DataSource

.DataSource(d => d
   .Schema(s => s
      .Model(m =>
      {
         m.Id(e => e.Id);
         m.Field(m => m.ApplicationDate).Parse("parseDate");
      })))

 

and finally my javascript parsing method

parseDate: function (e) {
   var date = kendo.parseDate(e);
   return date ? date.toJSON() : date;
}

s

0
Nikolay
Telerik team
answered on 22 Jan 2021, 11:59 AM

Hello Francis,

I am happy to hear you managed to resolve the situation and thank you for sharing what you came up with the community. I believe others facing the same scenario will benefit from it.

Please do not hesitate to contact us back if anything new arises.

Regards,
Nikolay
Progress Telerik

Virtual Classroom, the free self-paced technical training that gets you up to speed with Telerik and Kendo UI products quickly just got a fresh new look + new and improved content including a brand new Blazor course! Check it out at https://learn.telerik.com/.

0
FranckSix
Top achievements
Rank 1
Veteran
answered on 22 Jan 2021, 02:06 PM

Hi,

1 more question. Now is ok for collection updated and destroyed, but still have problem with created

destroyed / updated: [
{
   Id: 0,
   ApplicationDate: "2016-04-26T04:00:00.000Z"
}]
 
created: [
{
   Id: 0,
   ApplicationDate: Tue Apr 26 2016 00:00:00 GMT-0400 (heure d’été de l’Est)
}]

 

On the both situation I used the datepicker. I also try to enter the date manually... same result!

It seem it missing a little part ?

 

0
Nikolay
Telerik team
answered on 26 Jan 2021, 12:31 PM

Hi Francis,

This behavior is odd and I am not sure what might be the cause of it. 

Is it possible to prepare and share a sample runnable page that clearly replicates and isolates the problem. Examining this page locally will help me fully understand the case and allow me to advise further.

Feel free to open a new private support ticket if sharing a project publicly is not an option for you.

Regards,


Nikolay
Progress Telerik

Virtual Classroom, the free self-paced technical training that gets you up to speed with Telerik and Kendo UI products quickly just got a fresh new look + new and improved content including a brand new Blazor course! Check it out at https://learn.telerik.com/.

0
FranckSix
Top achievements
Rank 1
Veteran
answered on 27 Jan 2021, 02:16 PM

Hi Nikolay,

I build a demo solution. You must add the Telerik Nuget Source packages to VisualStudio to compile the project.

What I found is the problem was not prensent until I put the .Filterable(false) on the Bound column. Since I set the filterable to false the return value of my date was is wrong format.

Very a great tank-you for help!

0
Nikolay
Telerik team
answered on 29 Jan 2021, 11:18 AM

Hello Francis,

Thank you for sharing the project with me.

Unfortunately, I am not able to build it. I receive a list with errors and even though I added the Kendo UI dll is still has a working icon:

Could you please send the project again excluding only the "bin", "obj", and "packages" folders? These contain files that will be auto-generated once the project built starts. For your convenience, I am attaching such a project as a sample you could use to replicate the problem on top.

Looking forward to your reply.

Regards,
Nikolay
Progress Telerik

Virtual Classroom, the free self-paced technical training that gets you up to speed with Telerik and Kendo UI products quickly just got a fresh new look + new and improved content including a brand new Blazor course! Check it out at https://learn.telerik.com/.

0
FranckSix
Top achievements
Rank 1
Veteran
answered on 01 Feb 2021, 02:00 PM

Hi Nikolay,

As requested I rearrange the project

Note that all nuget packages come from https://api.nuget.org/v3/index.json except Telerik.UI.for.AspNet.Mvc5 come from https://nuget.telerik.com/nuget

I using package reference from project not form package.config

I using VisualStudio 2019 to compile the project

I taking care to add .vsconfig for missing VS components

Thanks

0
Nikolay
Telerik team
answered on 03 Feb 2021, 11:19 AM

Hello Francis,

Thank you for sharing back the project.

I managed to build and run it this time. Here is the send to the server date data on both Update and Create to be in the correct format:

- Update:

- Create:

Can you please ensure the correct project was attached? Or if I am missing something please let me know.

Regards,
Nikolay
Progress Telerik

Virtual Classroom, the free self-paced technical training that gets you up to speed with Telerik and Kendo UI products quickly just got a fresh new look + new and improved content including a brand new Blazor course! Check it out at https://learn.telerik.com/.

0
FranckSix
Top achievements
Rank 1
Veteran
answered on 03 Feb 2021, 04:51 PM

Hi Nikolay,

Sorry ma fault! I gave you the wrong project. This is the good one.

0
Nikolay
Telerik team
answered on 05 Feb 2021, 12:21 PM

Hello Francis,

Thank you for sharing the project with me.

Unfortunately, I am not able to open in in Visual Studio:

And when I click ok:

Can you please check on the project again? Please ensure you are removing the "bin", "obj", and "packages" folder before achieving. All the rest are required so I can build and run it correctly.

Regards,
Nikolay
Progress Telerik

Virtual Classroom, the free self-paced technical training that gets you up to speed with Telerik and Kendo UI products quickly just got a fresh new look + new and improved content including a brand new Blazor course! Check it out at https://learn.telerik.com/.

0
FranckSix
Top achievements
Rank 1
Veteran
answered on 05 Feb 2021, 01:32 PM
Yesy simply the project is using IIS and you need to open VS in admin mode to project load
0
FranckSix
Top achievements
Rank 1
Veteran
answered on 05 Feb 2021, 01:42 PM
Or if you prefer is the version using IISExppress
0
Nikolay
Telerik team
answered on 09 Feb 2021, 10:40 AM

Hello Francis,

Thank you for sharing the project. I managed to open it.

I set a debugger and saw that the send dates on Create are actually in the correct format:

Am I missing something?

Regards,
Nikolay
Progress Telerik

Virtual Classroom, the free self-paced technical training that gets you up to speed with Telerik and Kendo UI products quickly just got a fresh new look + new and improved content including a brand new Blazor course! Check it out at https://learn.telerik.com/.

Tags
Grid
Asked by
FranckSix
Top achievements
Rank 1
Veteran
Answers by
Nikolay
Telerik team
FranckSix
Top achievements
Rank 1
Veteran
Share this question
or