Hi,

 

Is there a way to open a date picker component targeting the month of a future minimum date ?

For example, I have a minimum date in 3 months. When I open the date picker, the popup is focus on today. When I change the month or click on 'Today', the focus goes on the month of this future date as expected.

I would like to have this behavior when opening the popup.

I tried to use the NavigateTo() with the OnOpen() event but no luck.

REPL example : https://blazorrepl.telerik.com/cJYCGmlk51WrceTj48

 

Thanks in advance

Hello,

I noticed that when TelerikDatePicker and TelerikTimePicker components are used with nullable DateOnly and nullable TimeOnly values, respectively, and ShowClearButton is set to true, the "X" button still appears in an empty field when the value is null. This shouldn’t happen, as there is no value to clear. When you click on the field to type a date or time, the "X" button disappears.

Here is the reproduction of the issue:

https://blazorrepl.telerik.com/GfaCbmlz03hT2mky54

It doesn’t seem like this is intended behavior. If it’s not, is there a workaround to prevent the "X" from appearing when there is no value?

Thanks,

Ivaylo

 

Hello:

As the subject line states, is there a way to open the DatePicker programmatically?

i am using TelerikDatePicker. I want to use user's timezone based date which i am getting in "OnAfterRenderAsync" but the telerikdatepicker is mixing up between server's date and user's timezone based date.
when i click today instead of selecting user's timezone based date(3 july), it selects the server based date i-e 2 july (which is different). Moreoever, as per in attached image user's timezone based date is 3 july 2025 and server's date is 2 july 2025 and the font of 2 july 2025 is red however the highlighter has moved to 3 july 2025.
I want the datepicker to use  user's timezone based date and deal it like it has been dealing with server's date.

this is my razor page
<TelerikDatePicker Format="dd-MMM-yyyy"
                   @bind-Value="@abc.rcvdDateDW"
                   Enabled="@isDetailEditable"
                   OnOpen="OnDatePickerOpenDW"
                   OnClose="OnDatePickerCloseDW" />

this is how i am setting things up in my razor.cs
    protected override async Task OnAfterRenderAsync(bool firstRender)
    {
        if (firstRender && !_initialized)
        {
            _initialized = true;

            try
            {
                var userTimeZoneId = await tokenStorage.GetTokenAsync(UserTimeZoneInfokey);
                var timeZoneId = string.IsNullOrWhiteSpace(userTimeZoneId) ? "UTC" : userTimeZoneId;
                TimeZoneInfo userTimeZone = TimeZoneInfo.FindSystemTimeZoneById(timeZoneId);
                userTimeInTimeZone = TimeZoneInfo.ConvertTimeFromUtc(DateTime.UtcNow, userTimeZone);
            }
            catch
            {
                userTimeInTimeZone = DateTime.UtcNow; // fallback
            }
 await ShowData();
 InitializeTabsBasedOnPermissions();
 await Tasks();

 StateHasChanged();
}}
       public async Task OnDatePickerOpenDW(DatePickerOpenEventArgs args)
       {
           if (abc.rcvdDateDW == null && !isTempDateDWReceived)
           {
               abc.rcvdDateDW = userTimeInTimeZone;
               isTempDateDWReceived = true;
               StateHasChanged();
           }
       }
       public async Task OnDatePickerCloseDW(DatePickerCloseEventArgs args)
       {
           if (isTempDateDWReceived && abc.rcvdDateDW == userTimeInTimeZone)
           {
               abc.rcvdDateDW = null;
               isTempDateDWReceived = false;
               StateHasChanged();
           }
       }

thats the output i am getting 

Does telerikdatepicker do support this or not ? if yes kindly guide me how can i achieve this. I have tried many ways but none of them worked. Thanks

Hy,

is there a way to customize the template visualization of each day in the DatePicker component?

I need to change the style and colors of the days according to different conditions. For examples:

 

Thanks in advance

 

I have a custom grid filter where I use an animation container to show/hide.  When a value changes, I want to close the animation container similar to how the filter automatically closes on your control filters (treelist).  So, I have a button that toggles the filter state (ExpandCollapse).  Then, when a value changes in my filter (textbox in example) I call a method that should close the filter and refresh my data.  I find the OnChange event is called once a value is changed (textbox) but then also when the DatePicker closes and when the DropDownList closes and when the animation container is closed.  

The result is the toggle kinda goes nuts.  Its open/closed/opened at times where it shouldn't.  How do I get around this?


I tried to compare the existing value with the new value after removing the binding but, no success.

Toggle

We have a Blazor DatePicker in our web app to store the Date of Birth.  The calendar popup seems to be working correctly.  However, for the input portion, when typing in the year of the date, the content typed into the year overflows the input area for as long as the user types, instead of horizontally scrolling within the 4-digit year space.

The interesting thing is that this is only happening to one of our client users.  We have been unable to duplicate this either locally or in our Dev/Test environments.  I'm assuming that, since the horizontal scrolling of the year entry is within the DatePicker widget, could this possibly be due to an environment issue with the Blazor library or maybe some setting within Microsoft Edge?

I don't have as many details as I would like to have to share with you.  At this time, I'm just trying to find out if you have ever heard of this issue before?

Hi i have a DatePicker in a module form. If i resize the browser window in order to have low visible space below the datepicker, then i open the datepicker popup, it create a strange effect on the page.

For example i have this page with a datepicker (highligted in red):

if i open the datepicker popup the dom change adding white space on bottom of the page:

closing the popup, the white space disappear.

How to solve?

Thanks

 

 

I am working on a mobile app using Blazor Hybrid, I have a TelerikDatePicker field on a page. 
Is there a practical way when I focus on that field it automatically shows the numeric keyboard instead of alphanumeric keyboard ? like when using TelerikNumericTextBox.

Thank you.

Hello,

I have a 2 date pickers. I have a button that clears all fields in my form which works when the dates are fully filled, but not if they are partially filled. I want to clear them with my button and not have to use the ShowClearButton (x button) that is built into the date picker. Not sure if there is already a solution for this, but I could not find one.