Edit Inline datetime showing Null

[Marcus]

Hello,

Can someone please help.

I'm trying to do a simple Inline edit grid which has a datetime field but when clicking update the datetime field which is passed through to the controller has null.  It's actually replicated in the example which Progress supply.  

How do I get a valid date through to the controller? surely this is quite a big issue?  is it a locale problem?

.chtml

}

<div class="row">
<div class="col-xs-18 col-md-12">
@(Html.Kendo().Grid<Sample.Models.OrderViewModel>()
.Name("grid")
.Columns(columns =>
{
columns.Bound(p => p.Freight);
columns.Bound(p => p.OrderDate);
columns.Bound(p => p.ShipName);
columns.Bound(p => p.ShipCity);
                    columns.Command(command => { command.Edit(); command.Destroy(); }).Width(160);
})
.Pageable()
.Sortable()
                 .Editable(editable => editable.Mode(GridEditMode.InLine))
.Scrollable()
.Filterable()
.HtmlAttributes(new { style = "height:550px;" })
.DataSource(dataSource => dataSource
.Ajax()
.PageSize(20)
                    .Batch(true)

                    .Model(model => model.Id(p => p.OrderID))
.Read(read => read.Action("Orders_Read", "Grid"))
.Update(update => update.Action("Orders_Update", "Grid"))
)
)
</div>
</div>

GridController.cs

using System;
using System.Collections.Generic;
using System.Linq;
using System.Threading.Tasks;
using Microsoft.AspNetCore.Mvc;
using Kendo.Mvc.UI;
using Sample.Models;
using Kendo.Mvc.Extensions;

namespace Sample.Controllers
{
    public class GridController : Controller
    {
        public ActionResult Orders_Read([DataSourceRequest]DataSourceRequest request)
        {
            var result = Enumerable.Range(1, 50).Select(i => new OrderViewModel
            {
                OrderID = i,
                Freight = i * 10,
                OrderDate = new DateTime(2016, 9, 15).AddDays(i % 7),
                ShipName = "ShipName " + i,
                ShipCity = "ShipCity " + i
            });

            var dsResult = result.ToDataSourceResult(request);
            return Json(dsResult);
        }
        [AcceptVerbs("Post")]
        public ActionResult Orders_Update([DataSourceRequest]DataSourceRequest request, [Bind(Prefix = "models")]IEnumerable<OrderViewModel> products)
        {

     //products.OrderDate is null even though I've selected a date on the edit datepicker.
            return Json(products.ToDataSourceResult(request));
        }

    }
}

 

[Tsvetomir]

Hi Alan,

The null value on the server-side would indicate that the date value has not been parsed correctly. And when the parsing is not done correctly, the null value gets assigned to the property. 

I have created a sample project which uses the provided code snippets. However, I did not manage to replicate the described behavior. Is it possible for you to modify the project attached to my response and send it back to me so that I can examine the case locally?


Best regards,
Tsvetomir
Progress Telerik

[Marcus]

Hi Tsvetomir,

Thanks for your reply.

I worked it out yesterday.  Basically if we have a date/time field in the model but don't select the time in the kendo datepicker and submit the form, this field is passed through as Null.  For me I was expecting it to at least pass that date with a 00:00 time.  You should be able to replicate this with your sample as is.

Thanks again, 

Kind regards, Alan

 

[Tsvetomir]

Hi Alan,

Thanks for the additional details provided. 

I have tested out the described scenario. Indeed, the value would be null. However, the reason behind the null value is that the new date is not getting applied to the corresponding property. This is due to the fact that the picker has a specific format which uses to parse the value. 

If you would like to enable the input of a date without time, you would have to specify additional parse formats:

@(Html.Kendo().DateTimePickerFor(m => m).ParseFormats(new[] { "MM/dd/yyyy"}))

And now, the hours would be automatically set to 12:00AM or 00:00. 

I hope this is helpful.


Best regards,
Tsvetomir
Progress Telerik

[Marcus]

Hi Tsvetomir,

Thanks for this.. I've added this however if you select a day grater than 12 it still returns Null.. 

Any thoughts??

Can you please send an example if it's not erroring for you.

Many thanks, Alan

[Tsvetomir]

Hi Alan,

If the date field in the grid is nullable and invalid date is inserted in the date picker, it would not parse it. Therefore, it would assign the null value. The date format should follow the one from the current culture. For instance "MM/dd/yyyy", the user would have to put values which are compliant with the format. 

In order to inform the user that the format that they have provided is invalid, add additional validation which would prevent the item from being submitted to the server-side.

I have attached a sample project in which if you insert valid date, the value would be automatically parsed and assigned to the field. 


Best regards,
Tsvetomir
Progress Telerik

[Marcus]

Hi Tsvetomir,

Thanks, this still didn't kinda work for me but you pointed me into the direction of cultures and as being in the UK I had to set the culture accordingly.

Regards, Alan