Clear date on entering invalid dates in datepicker

[Jeroen]

Hello kendo,

When an user is entering the date with an invalid format like dd.mm.yyyy (so 27.06.2023) into our datepicker, it looks like the date is accepted in the UI, but the value is actually empty. What is confusing for the user. To fix this we would like to clear the value when an user entered an invalid date. How can we do this ?

I found an example for the datetimepicker, but it requires an initial filled in date, if you start with an empty value it's not working. The problem comes from the problem that it's impossible to tell if the value is empy or invalid.

https://docs.telerik.com/kendo-ui/knowledge-base/prevent-invalid-values
PS the script has an bug and is not working, add to following to the script to get it working:   

        $("#datetimepicker").kendoDateTimePicker({
          change: onChange,
          close: onClose,
          open: onOpen,
          value: new Date()
        });
        var lastValidDate = $("#datetimepicker").data('kendoDateTimePicker').value();
      });
    </script> 

Regards,
Jeroen

[Nikolay]

Hi Jeroen,

This behavior is expected as the change event is not triggered when the initial value is null or when it is an invalid date it also evaluates to null. 

To overcome this you can manually trigger the change event on the change of the input.

$("#datetimepicker").on("change", function (e) {
     $("#datetimepicker").data('kendoDateTimePicker').trigger('change');
});

Dojo demo: https://dojo.telerik.com/OcAFITAk

Regards,
Nikolay
Progress Telerik