Hi All,

We recently have undertaken an effort to upgrade our project to Angular 16 and as part of that we also updated all of our Kendo libraries to 14.2.0.  Since the update, many of our datepicker inputs are behaving extremely strangely, namely, you open the datepicker and it starts frantically scrolling into the past without stopping. I'll attach a gif showing the issue. 

Strangely I can't seem to reproduce it consistently, it happens on our test server every single time but not on my local machine.  Here is an example of how the datepicker looks in code, though it happens across many of them in the application:

            <kendo-datepicker
              class="w-100"
              [value]="getDateTimeValue()"
              [format]="'MM/dd/yyyy'"
              [disabled]="valueCanBeEmpty()"
              (valueChange)="handleDatePickerValueChanged($event)"
              [popupSettings]="{appendTo: 'component'}"
              [attr.data-qa-id]="'datepicker-value-'+field.SourceName">
            </kendo-datepicker>

Any help would be appreciated

Not sure why, but when i use the kendo-datepicker anywhere in my application, datepicker header template is invisible. I tried with kendo-calender, header is visible initially, but on click of any date buttons or "Today" button it's hiding. Kindly assist soon. Am I missing something? Is there any event's that should be controlled? or can we resolve with styles? 

Hi, in our team we had issues with a tricky bug that we discovered in Safari for Kendo UI for Angular.

Steps to reproduce

1. In Safari, make sure that content is scrollable by having content that does not fit in the current size of the browser window. 

2.  Open a kendo window over the content, with a kendo datepicker inside.

3.  Possibly make the browser window smaller in height (depending on the screen resolution).

4. Open the datepicker popup.

Expected behaviour

Kendo window along with its content stay were it is. 

Actual behaviour

The kendo window jumps upwards and is partially out of view. 

If the page is still scrollable the user can scroll back to see all of the kendo window. For my team the problem was that we have an "overflow: hidden" css style on the body to prevent scrolling outside the kendo window when it is opened. This is problematic for the user since they cannot scroll back to see all the content of the kendo window. This problem only happens in Safari.

Solution

To solve it we set "position: fixed" on the wrapping element of the kendo window.

Stackblitz

https://stackblitz.com/edit/angular-p1tgbe-u8g3ff

Hello,
we work in angular and typescript.

I need to make a button who reset all control in the form to empty value.

How I can clear the value of kendo-datepicker ?

When we load the the form the kendo-datekiper is blank (like the sampe https://www.telerik.com/kendo-angular-ui/components/dateinputs/datepicker/)

A user select a date. If the user clear manually the date all work.

I need the code for reset the value kendo-datepicker to  "bank" ? null? undefined? 

I have tried woth the binding of the value properties.

variable:

dt_value!: Date;

<kendo-datepicker [(value)] = "dt_value" > </kendo-datepicker>

But if I set variable dt_value to undefined I receive an error.

Thanks for any help.

LSo

I am currently using the DatePicker component, and I have already localized it to zh-Hant using i18n.

However, I have encountered a specific issue and would appreciate your professional assistance.

The current display of dates in the DatePicker shows the AD (Anno Domini) year, but I wish to convert it to the ROC year format for Taiwan . According to the ROC calendar system, this involves subtracting 1911 from the AD year to obtain the corresponding ROC year.

As an example, for the AD year "2023," I would like the displayed format to be "112."

Could you please advise me on how to achieve this specific date format adjustment while using the DatePicker component?

I look forward to your guidance and suggestions. Thank you!

Hi,

can i use format = "mm/dd/yyyy" mm in short format i used like this in my project but it is not taking month correctly only if i use as below

format="MM/dd/yyyy"

format="mm/dd/yyyy"
please let me know if i can use this format and achieve month working correctly i am referring to placeholders as per below
https://www.telerik.com/kendo-angular-ui/components/dateinputs/datepicker/placeholders/

Since upgrading to 14.0.1, if a date-picker is provided with a Date object that contains time (e.g., if I default it to "right now", aka `new Date()`), trying to change the value with the keyboard will only allow 2 digits.

So, effectively, as I try to type, say, 2013, the date-picker's year field will show:

0002
0020
0001
0013

I have not been able to find anything in the API that switches how many years the input should accept (only which year should be the "break around" for 2-digit years).

If the field is prefilled with a Date object with no time (i.e. time is 00:00:00), this doesn't happen.

What am I missing?