How to set the DatePicker default text

[Jon]

I have a nullable DateTime property in my view model, and I'm binding it to a DatePicker, with a custom date format like so:

@Html.Kendo().DatePickerFor(model => model.MyNullableDateTimeField).HtmlAttributes(new { @class = "form-control" }).Format("MM/dd/yyyy").ParseFormats("MM/dd/yyyy", "yyyy-MM-dd").DateInput(true)

However, it displays like this:

And when I try to submit the form, I get a model validation error:  "The value 'month/day/year' is not valid for <my property name>", and it is not possible for me to clear the text from the control at all. 

If I input a valid date, it does submit correctly, but I need to be able to have a null value here. I tried
$("#MyNullableDateTimeField").data("kendoDatePicker").value(null) but that did not work. (also tried .val instead of .value)

Also, if there is anyway to have the DatePicker control submit the value in the more standard yyyy-MM-dd format, and just display it in the custom format, I would very much like to know that as well, as it would save me a lot of trouble. I don't understand why it submits a raw string in the "MM/dd/yyyy" format when a standard <input type="date"> will submit in a yyyy-MM-dd format and just display the value in the regular format. 

Thanks!

 

[Ivaylo]

Hi Jon,

Thank you for the details provided.

When the value of a model property is null, the default placeholder in the date picker allows the user to select a date. Regarding formatting, when the form is submitted, the date is parsed into a DateTime object, which by default uses the MM/dd/yyyy format. This behavior is inherent to C# and is not influenced by Telerik components; it reflects the standard formatting conventions of the .NET Core.

• https://learn.microsoft.com/en-us/dotnet/standard/base-types/standard-date-and-time-format-strings 

I hope this information was helpful and I look forward to your reply.

Regards,
Ivaylo
Progress Telerik

[Jon]

That's fine, but the main problem is that the input box displays the text 'month/day/year'. This text is also submitted to the back end, and throws a validation error. It should just be an empty text box, like how the jquery version of the control works, or at least not submit that raw text back to the server. 

It is not possible to clear the text 'month/day/year' from the text box, and it is not possible to submit an empty or 'null' date value. 

[Ivaylo]

Hi, Jon

Thank you for the details provided.

I have created a sample application where I implemented a DatePicker in form and everything is working as intended. The application is attached to this reply. Please let me know if this is the desired result. If not, share more information or reproduce the issue in the attached project. This way, we could debug the code on our end and provide more accurate solution.

I hope this project was helpful.

Regards,
Ivaylo
Progress Telerik

[Jon]

Thanks. Must be something weird in my solution. The jquery version of the control works as expected, so I'll go with that instead of wasting more hours trying to figure out why this one isn't working in my solution. Thanks!