Hi.
When entering an invalid date in a DateTimePicker, the component will automatically revert the entered value back to its previous valid value.
I didn't expect this because the user may type in an invalid date, and continue to the next input control within the form, and not notice the error that was briefly displayed.
The issue can be reproduced in the DateTimePicker Demo here: https://demos.telerik.com/blazor-ui/datetimepicker/validation
Steps to reproduce:
1. Click in the day part of the date.
2. Enter 13
3. Enter 2100
4. Press the Tab key
5. Notice the date is automatically reverted (back) to 10/13/2019.
I expected the date to be set to 10/13/2100 with the input validation errors visible to the user after pressing the Tab key in step 4.
I've categorized this issue as a bug because otherwise, the form can be submitted with a value that the user did not enter.
If this behavior cannot be changed from being the default behavior, then there should be an option to prevent this behavior from happening.
Thank you.
If you are zooming a page containing a DateTimePicker with "AdaptiveMode" set to "AdaptiveMode.Auto", the application crashes occasionally with the error:
Microsoft.JSInterop.JSException: Cannot read properties of null (reading 'addEventListener') TypeError: Cannot read properties of null (reading 'addEventListener')
The more adaptive DateTimePicker instances the page contains, the more likely the error is to occur.
When the component's Adaptive mode is set to Auto, the Date & Time buttons in the popup are not rendered.
<AdminEdit>
Here is a CSS workaround that hides the titlebar in adaptive mode so that the buttons are present:
<style>
.k-actionsheet-titlebar.k-text-center{
display: none;
}
</style>
<TelerikDateTimePicker @bind-Value="@SelectedTime"
Format="MM/dd/yyyy hh:ss"
ShowWeekNumbers="true"
Id="selected-date"
AdaptiveMode="Telerik.Blazor.AdaptiveMode.Auto">
</TelerikDateTimePicker>
@code {
private DateTime? SelectedTime = DateTime.Now;
}</AdminEdit>
It does not happen always and I think it is happenning when the internet connection is slow and it shows a Javascript error as well (screenshots below)
DateTimePicker loses focus when the NOW button is clicked.
To reproduce the problem open the following demo:
https://demos.telerik.com/blazor-ui/datetimepicker/overview
Try clicking a few times on the NOW button. The focus is occasionally lost.
https://www.screencast.com/t/BPEXTy43
I want the user to only be able to select times between, for example, 11AM and 1PM. Setting Min and Max does not limit that, I can select any time:
Selected time: @selectedTime<br />
<TelerikDateTimePicker Min="@Min" Max="@Max" @bind-Value="@selectedTime"
Format="dd MMM yyyy HH:mm" Width="250px"></TelerikDateTimePicker>
@code {
private DateTime? selectedTime = DateTime.Now;
public DateTime Min = new DateTime(2020, 6, 11, 10, 15, 0);
public DateTime Max = new DateTime(2020, 6, 13, 12, 30, 45);
}