Default Empty value in Kendo DatePicker

Question

I need the default value of datetime picker to be empty.

@(Html.Kendo().DatePickerFor(model => model.RevisionDate)
              .Name("RevisionDate")
                )

"RevisionDate" is a datetime property in a asp.net mvc model.

how it's currently being displayed

and i need to display it as below

Answer 1

Your RevisionDate property is by default set to DateTime.MinValue which is 01/01/0001 ( all DateTime properties behave like that). This is why the Kendo UI DatePicker shows it like that. The solution is to make the property a nullable DateTime (DateTime?) whose default value is null.

Answer 2

I had the same problem with a ComboBoxFor ComboBoxFor(m => m.LocationId).Value(Model.LocationId == 0 ? string.Empty : Model.LocationId.ToString()).

But I see that this approach doesn't work on the DatePickerFor(It could be a bug).

A workaround could be made in JS if($('#RevisionDate ').val() == "1/1/0001") { $('#RevisionDate ').val("") } but I would recommand Atanas's approach with a nullable field.

Answer 3

Blank out the field from the client side using something like this in your markup/cshtml file :

<script>
    // Blank out the 1/1/0001 12:00 AM from the date field
    $('#RevisionDate').val("");
 </script>

Answer 4

If you don't want to make the property nullable, you can also do it like this:

@(Html.Kendo().DatePickerFor(m => m.Property).HtmlAttributes(new { value = "" }))