I am currently trialing the UI for ASP.NET MVC with the new asp.net core 1.0.
I am using a grid control to edit data however the dates returned to the controller have an invalid format and the ModelState is invalid. I am using the New Zealand format of "dd/MM/yyyy" for the date.
I noticed the datepicker is returning a time component which seems odd as it is not a datetimepicker.
I also noticed that the telerik example project found here https://github.com/telerik/ui-for-aspnet-mvc-6-demos also suffers from the same error when using the grid inline editor or popup editor example.
Error Message:
"The value '20/10/2010 12:00:00 a.m.' is not valid for Due Date."
Grid:
01.@(Html.Kendo().Grid<GearBox.Models.Invoice>()02. .Name("grid")03. .Columns(columns =>04. {05. columns.Bound(p => p.InvoiceID);06. columns.Bound(p => p.Description);07. columns.ForeignKey(p => p.CompanyID, (System.Collections.IEnumerable)ViewData["companies"], "CompanyID", "Name")08. .Title("Company");09. columns.Bound(p => p.InvoiceDate).Width(130).Format("{0:dd/MM/yyyy}").EditorTemplateName("Date");10. columns.Bound(p => p.DueDate).Width(130).Format("{0:dd/MM/yyyy}").EditorTemplateName("Date"); ;11. columns.Bound(p => p.Paid).Width(80).ClientTemplate("<inputtype='checkbox'disabled='disabled'#= Paid ? checked='checked':'' # />");12. columns.Command(command => { command.Edit(); command.Destroy(); }).Width(200);13. 14. })15. .ToolBar(toolbar => toolbar.Create())16. .Editable(editable => editable.Mode(GridEditMode.InLine))17. .Pageable(pageable => pageable18. .Input(true)19. .Numeric(false)20. )21. .Sortable()22. .Scrollable()23. .HtmlAttributes(new { style = "height:430px;" })24. .DataSource(dataSource => dataSource25. .Ajax()26. .PageSize(20)27. .Model(model =>28. {29. model.Id(a => a.InvoiceID);30. model.Field(a => a.Company.Name).Editable(false);31. 32. })33. .Create(update => update.Action("Invoices_Create", "Invoice"))34. .Read(read => read.Action("Invoices_Read", "Invoice"))35. .Update(update => update.Action("Invoices_Update", "Invoice"))36. .Destroy(update => update.Action("Invoices_Destroy", "Invoice"))37. )38.)
Date Editor Template:
1.@model DateTime?2. 3.@*@(Html.Kendo().DatePickerFor(m => m).HtmlAttributes(new { style = "width:80%" }).Format("{0:dd/MM/yyyy}"))*@4.@(Html.Kendo().DatePickerFor(m => m).Format("{0:dd/MM/yyyy}") )
Model (showing the date field only)
1.[Display(Name = "Invoice Date")]2.[DataType(DataType.Date)]3.[DisplayFormat(DataFormatString = "{0:dd/MM/yyyy}",4. ApplyFormatInEditMode = false)]5.public DateTime? InvoiceDate { get; set; }
Controller Update Method
01.[AcceptVerbs("Post")]02.public ActionResult Invoices_Update([DataSourceRequest] DataSourceRequest request, Invoice invoice)03.{ 04. if (invoice != null && ModelState.IsValid)05. {06. Update(invoice);07. }08. return Json(new[] { invoice }.ToDataSourceResult(request, ModelState));09.}