Date Picker With Red Borders When Set with Minimum Date

[Alexandre]

Hello,

I have a DatePicker control defined in Javascript like this:

And I am setting the today's date like this:

        var datePicker = document.getElementById("txtDataInicial").ej2_instances[0];

        datePicker.value = moment(viagem.dataInicial).toDate(); // Ou use o método correto para definir o valor
        datePicker.dataBind(); // Atualiza a interface

But when I set, programaticly a data for the control as today date, wich is also the minimum date, the control stays like this:



If I choose in the control the same date, or any date after that, it goes normal:



What could be happening?

Thanks,

Alexandre

[Priyanka Karthikeyan]

Hi Alexandre,

 

Thank you for reaching out to us!

 

When you set the value using moment(viagem.dataInicial).toDate(), it can return a date in UTC format, such as 2024-11-04T18:30:00.000Z. This may cause the error class to be added if it falls outside the defined limits for the DatePicker.

 

To bind the current date properly, it’s recommended to use new Date(). Here’s a code snippet demonstrating this:

 

​datepicker.value = new Date();

Sample: Ckquiy (forked) - StackBlitz

 

This approach ensures that the date is properly recognized within the expected range of the DatePicker, preventing any error classes from being applied.

If you have any further questions or need additional assistance, feel free to ask!

 

Regards,

Priyanka K