When scrolling to the right and to the bottom the columns and rows are not aligned any more.

This is already visible in the example in the documentation: https://www.telerik.com/kendo-angular-ui/components/gantt

Hello,

I tried to implement this new feature : https://www.telerik.com/kendo-angular-ui/components/grid/scroll-modes/virtual#controlling-the-expanded-state-of-all-root-level-groups

You can see in the demo that if you remove all grouping, the content is now limited to 50 lines instead of displaying the whole 1000.

I found a workaround by expanding all before removing the grouping but it is not very user friendly.

If you can patch it ASAP that would be great. 

And thank you to finally have pushed this long awaited feature !

First of all, thank you for providing the state management feature. For me it's one of the most important features of a grid component.

But unfortunately it fails to restore the columns state. This is because each time a grid component and it's columns are instantiated, new IDs are created for the columns. When loading state the columns are identified by their IDs.

When a column is persisted with e.g. id 'k-grid-column-1' and the grid will be destroyed and re-created, then the new column ID is not identical with the old one. Thus restoring the column's state will fail.

Please have a look to this StackBlitz example: https://stackblitz.com/edit/angular-vauqyshn?file=src%2Fapp%2Fapp.component.ts

A possible workaround is to save also the column's field property and later use it to re-map the saved id to the new id.

A better solution may be to extend the GridColumnComponent with something like a "PersistenceKey" property, which will be used for identifying a column. A directive may also work. Otherwise generating non transient unique ids for the grid columns will also work.

Best regards,
Holger

I am using below piece of code inside <kendo-grid>. Here, I am using a dropdown and kendo excel export button inside toolbar. dropdown is in left and button is right aligned. Earlier, it was working till Kendo 18. When I upgraded to kendo 19, it stopped working. 

Root Cause is kendo-dropdownlist contains an array button. When we click on button to expand dropdown, excel export button gets the focus and dropdown loses focus. When we click on dropdown button, 'k-focus' class is applied on 'excel-export'. Because of this, dropdown is not working. 

Code:

<ng-template kendoGridToolbarTemplate>

        <div class="toolbar-container" style="display: flex; align-items: center; gap: 16px; width: 100%;">

            <!-- Dropdown Wrapper -->

            <div style="flex-shrink: 0;">

                <kendo-dropdownlist [data]="data"

                    [(ngModel)]="someField" [valuePrimitive]="true" (valueChange)="perform()"

                    [popupSettings]="{ appendTo: 'component' }" style="width: 175px;">

                </kendo-dropdownlist>

            </div>

            <!-- Spacer to push button to right -->

            <div style="flex-grow: 1;"></div>

            <!-- Excel Export Button -->

            <div style="flex-shrink: 0;">

                <button type="button" kendoGridExcelCommand>Export</button>

            </div>

        </div>

    </ng-template>

Describe the bug
The Kendo UI DropDownTree has several ARIA errors appearing according to the Axe DevTools.

To Reproduce
Steps to reproduce the behavior:

1. Go to the following StackBlitz.
   
2. Inspect the page, in the inspector click the "axe DevTools" tab and then click the "Scan ALL of my page" button.
3. Under "Serious" issues you will see: ARIA toggle fields must have an accessible name

Expected behavior
There should be no ARIA errors related to the Kendo UI DropDownTree.

Screenshots
Please take a look at the following Screencast related to the issue.

Browser

• OS: All Supported
• Browser: All Supported
• Version: latest (e.g. Edge: 104.0.1293.70)

Hi team,

I am working on a simple UI where kendo combo-box is a "column" of a kendo tree-list. The problem is, the opening and closing of kendo combo-box also expands and collapses the kendo tree-list's row.

I think the event of kendo-combo-box is bubbled to treelist. Is this a bug or am I missing something? 

Here's my Stackblitz example for reproducing the issue (Link: https://stackblitz.com/edit/angular-18guak?file=src/app/app.component.ts)

When filter popup is opened, it need to be closed by click outside of it

However, popup is closed only after second click outside.

After popup was opened and closed for the first time - next times everything works correctly, so it can be reproduced only after refreshing the page with this component

It can be reproduced in example in your documentation: https://www.telerik.com/kendo-angular-ui/components/grid/filtering/filter-menu/#toc-custom-filters/

I upgraded today from 4.3.7 to v11 and the dates are 1 day off in the scheduler month view, meaning the date variable from let-date (I think).  

<kendo-scheduler
    <ng-template kendoSchedulerMonthDaySlotTemplate let-date="date">
                ...  
               <div>{{ date | kendoDate : 'dd' }}</div>
 

<kendo-scheduler

    <ng-template kendoSchedulerMonthDaySlotTemplate let-date="date">

                ...  <div>{{ date | kendoDate : 'dd' }}</div> 

The date is just flat out wrong. What's weird is the mouseover shows the correct date.

Again, if I use the old version everything works as expected but the v11 update I'm off by one.

Hi,

In Multiselect editor with open state prevented the component stops accepting mouse clicks as a way of moving cursor.

You can find repro here:  https://stackblitz.com/edit/angular-u1j1p5-grc1nk?file=src%2Fapp%2Fapp.component.ts

Just copy/paste or type some text and try to change cursor position in word/phrase in order to fix something inside provided word.

I used this example to replace the built-in icons of the Kendo UI components. I was able to modify all the icons except the x icon in the Kendo UI Dialog and Window component. The x icon in the Kendo UI ComboBox was replaced as well.

The issue can be seen in this StackBlitz example.

When enabling the showSelectAll option in a checkbox column on the TreeList component, a checkbox is rendered with the TreeListSelectAllCheckboxDirective. In its constructor, this directive includes some logic that causes the TreeList to instantiate a new ViewCollection every time a selection change occurs. However, the call to ViewCollection.loadView() does not pass the service responsible for determining expanded nodes, so the default fallback (which returns true for all nodes) is used.

Problem

• Unnecessary and potentially expensive backend calls

• Performance degradation, especially with large datasets

• Inefficient "select all" logic that does not respect the current loaded/visible state

This behavior appears to ignore the fact that TreeList is configured for remote data binding with lazy-loaded children.

Expected Behavior

• showSelectAll should only evaluate the currently loaded and visible items

• fetchChildren() should not be called for every node

• Integration with remote/lazy-loaded data should be respected

Suggested Solutions

1. Update TreeListSelectAllCheckboxDirective to properly integrate with the expanded node detection logic or allow injection of a custom service.

2. Provide an override or callback to control the behavior of the "select all" checkbox manually in remote scenarios.

Steps to Reproduce

1. Configure a TreeList with hasChildren and children to fetch child nodes lazily.

2. Enable selection with checkbox column and showSelectAll: true.

3. Click any checkbox inside the TreeList.

4. Observe that fetchChildren() is triggered for all nodes, not just expanded ones.

StackBlitz repro:

Open console and click on the first cell. 

https://stackblitz.com/edit/angular-e2ai4pjx?file=src%2Fapp%2Fapp.component.ts,angular.json

./node_modules/@progress/kendo-angular-layout/fesm2022/progress-kendo-angular-layout.mjs:19:0-75 - Error: Module not found: Error: Can't resolve '@progress/kendo-angular-progressbar' in 'C:\LiveMRIProjects\MRI.AgoraInsightsAnywhere-Angular\node_modules\@progress\kendo-angular-layout\fesm2022'

./node_modules/@progress/kendo-angular-layout/fesm2022/progress-kendo-angular-layout.mjs:22:0-56 - Error: Module not found: Error: Can't resolve '@progress/kendo-angular-intl' in 'C:\LiveMRIProjects\MRI.AgoraInsightsAnywhere-Angular\node_modules\@progress\kendo-angular-layout\fesm2022'

this is the error is coming

when we add kendo thing into module.ts file

If the pane is scrolled, the dark highlight shown when grabbing the splitter is misaligned like this:

Stackblitz repro can be found here

Issue 1: Flickering or Not Opening of Dropdown

• Steps to Reproduce:
  1. Click on the color picker.
  2. Click on any dropdown.
  3. Observe the behavior of the dropdown.

Issue 2: Clicking on Color Picker and Dropdowns (Dropdown not closing)

• Steps to Reproduce:
  1. Click on the color picker.
  2. Click on any dropdown.
  3. Repeat this with all dropdowns to get above screenshot.

Hi,

https://stackblitz.com/edit/angular-dadm5ywe?file=src%2Fapp%2Fapp.component.ts

Please select the top-most button, then press TAB until the focus is on the button in the last grid cell.
Then press tab again => the focus moves to the last cell itself.
Press tab again => the focus moves back to the last button. 
=> here we got into an endless loop, you cannot navigate to the button below the grid.

Interestingly, you can leave the grid if you navigate backwards with shift+tab.

best regards,

Michael

The date range picker is not closing when tabbing through inputs when the picker is appended to the 'component'. It also seems that once the date range picker loses focus, it does not close by clicking anywhere else in the document until it regains focus again or the document loses focus.

I reproduced it in Stackblitz and attached a video. In the video there is a button after the date picker that logs to the console when it gains focus. Focus starts at the top of the document, start tabbing until the date range picker pops up, then continue tabbing through the date range picker until the button below the picker gains focus. As you can see the date range picker does not close. Here is the Stackblitz editor link to this: https://stackblitz.com/edit/kendo-daterange-bug?file=app/app.component.ts

Thanks!

Mitchell

Hello,

The control https://www.telerik.com/kendo-angular-ui/components/utils/draganddrop/drag-container/ cannot be used on mobile devices. I am not able to move the element in its position. I also tested it directly on a mobile device and it doesn't work there either.

Please provide an option to use the utility on mobile devices.

When virtual is true for a multiselect and checkboxes are set to true, there is a bug which results in multiple items being selected.

To reproduce, one needs to scroll down a long list of items.  The amount to scroll seems random but might have something to do with the itemHeight setting.  When clicking directly inside the checkbox, two items are selected at once - the item selected, and one other seemingly random item.   This does not happen if the click selection event happens inside the item, but not the checkbox.

I have reproduced this inside this code sandbox: https://codesandbox.io/p/sandbox/mystifying-shirley-2qxn32