In the Spreadsheet, when users scroll horizontally to columns that are not initially visible, then activate Freeze Panes, the Spreadsheet scrollbar behave incorrectly
When Freeze Panes is activated after horizontal scrolling:
We use the KendoUI for jQuery framework in the enterprise SaaS application we create. Giving our clients access to their data and being able to provide a mechanism where a client could build out some of their own functionality on our Saas platform (ie accessing the Data, webservices etc) is highly desirable.
Our front end is based on a MicroUI approach, so if the client can vibecode building a new microUI, the UI experience with the other microUI we provide would be seamless. Examples might be: Create a Scheduler view showing all the European Holidays in 2026, or create a grid view populated with all the customers who have not transacted in 2025 and show their linkedin link/profile.
We can easily wrap any vide coded application into our application now using the microUI approach, but what we dont get is the same look and feel, themes and components being used. It is this we are looking to solve.
Hi!
I have noticed the following behavior of the Kendo-UI MultiSelect widget (reproducible in this DOJO):
-> the button is still focused
The user has interacted with the MultiSelect, so it should grab the focus. Since the tag is removed, I would have expected the whole widget to be focused instead. At least this is what happens when clicking the "clear" button.
In the latest version of Kendo UI, various input controls like the NumericTextBox or the ColorPicker now consist of an input field and a button control (used for increasing/decreasing the value or opening the dropdown).
The border-radius for those widgets can be controlled by setting the "rounded" option. At the same time, when using SASS themes, a button's default border-radius might be set using the $kendo-button-border-radius variable. The buttons inside e.g. a NumericTextBox do not override the theme's border-radius which leads to an outcome like this:
Widgets that use Buttons internally (and therefore offer no way of overriding the button's border-radius by setting its "rounded" option manually) should override the default styles.
Unfortunately, I could not reproduce the behavior in a DOJO, because I cannot transpile SASS themes there.
Consider the following scenario: There is a sortable Kendo-UI grid with a corresponding dataSource. Initially, the dataSource contains some items. When updating the dataSource to an empty array, all items disappear from the grid - so far, so good. However, if a column header is clicked afterwards to sort that column, the removed data reappears again.
We created a small "walkthrough" in this DOJO to demonstrate the issue.
FYI: The issue can be avoided by using a custom implementation of dataSource.transport.read which always returns the latest data.
Hi!
I am using the Kendo-UI Diagram widget to display relationships between items, that cannot be changed directly. I.e. I do not want users to be able to modify the diagram on their own. Unfortunately, I was not able to completely prevent modification of the diagram via its options.
For instance, I have set editable.remove to false. This prevents removing items already present at the widget's creation time, but it does not prevent removing items added later via diagram.addShape().
There are also several keyboard shortcuts like Ctrl+C (copy), Ctrl+V (paste), Ctrl+X (cut) and Ctrl+D (duplicate) that I would like to turn off.
The only solution I have found so far is blocking the corresponding keyboard events and preventing their default behavior, but this seems more like a hack than a solution.
What do you suggest?
The Typescript definitions for Kendo UI define the kendo.ui.ToolBarOpenEvent as follows:
interface ToolBarEvent {
sender: ToolBar;
preventDefault: Function;
isDefaultPrevented(): boolean;
}
interface ToolBarOpenEvent extends ToolBarEvent {
SplitButton?: JQuery | undefined;
}The event is also documented that way in https://docs.telerik.com/kendo-ui/api/javascript/ui/toolbar/events/open. However, the corrersponding method in kendo-toolbar.js:446-453 does the following:
open: function (e) {
var isDefaultPrevented = that.toolbar.trigger(OPEN, { target: element });
if (isDefaultPrevented) {
e.preventDefault();
return;
}
that.adjustPopupWidth(e.sender);
},Currently, the Kendo UI Toolbar supports adding icons to items by setting the "icon" property as documented here. However, only Kendo's own icons are supported.
In other widgets (like the Grid), adding custom icons (to a toolbar!) is already possible by specifiying an icon class.
However, if you wanted a third-party icon (or one of your own) directly to a standalone Toolbar, you would need to create a whole new template from scratch or replace the DOM element after rendering or use some hacky approach like demonstrated in this DOJO. While the first one means a lot of work, the latter ones are both not very stable.
Therefore, I propose to extend the icon support for Toolbars in general. I can think of two different solutions:
I created a forum post and it was suggested that I create a feature request for improved Kendo Grid keyboard accessibility when the grid contains locked columns and/or clickable elements such as buttons, links, and input boxes. I noted the following issues that I feel should be supported without having to write a bunch of workarounds or create a poor user experience for regular (mouse and keyboard) users.
This is an urgent concern because many of our clients are requiring our site to meet accessibility standards and with the heavy use of Kendo grids in their current state, it does not seem to.
I have a grid with 2 locked columns with a button in the first column and a hyperlink in the second column, the other columns just have text. I set navigatable to true. None of my fields are editable.
Here is a dojo: https://dojo.telerik.com/KUcMekCh
When the user tabs to the grid, they first get the search bar in my custom grid toolbar. Next they tab to the button (which happens to be a bootstrap dropdown menu but I don't think that is relevant). Here is where the issues start:
Hi!
I am loading Kendo-UI via npm (@progress/kendo.ui:2025.4.1321). The @progress/kendo-ui package internally references @progress/kendo-charts^2.9.0. At the time I installed kendo-ui, the latest available version of @progress/kendo-charts was 2.11.0, which is why npm chose this one.
However, this version leads to a JS error when rendering bar charts similar to this one:
Error: <g> attribute transform: Expected number, "matrix(NaN,NaN,NaN,NaN,…".This is caused by line 374 in @progress/kendo-charts/dist/es/chart/chart.js (version 2.11.0). It has been added in version 2.10.0. If I am using version 2.9.0 instead (which is also served by the CDN for Kendo-UI 2025.4.1321), everything works fine.
Is there an issue in the supported version ranges of the dependencies of @progress/kendo-ui?
Or does @progress/kendo-charts not follow the rules of semantic versioning?
I would like to avoid pinning the versions of all sub-dependencies of Kendo-UI just to avoid running into such conflicts when running "npm update".
The Kendo-UI Diagram widget supports moving the whole diagram using the pan() method. However, the given offset does always have to be absolute.
Consider the following example:
The diagram is zoomed in and therefore not fully visible - assume a current offset of (-100, -100). The users should be able to pan using keyboard shortcuts. Whenever pressing one of the arrow keys, the diagram is moved in the corresponding direction by e.g. 50px:
If the user presses [ArrowRight], pan() needs to be called with an offset of (-50, -100).
If the user presses [ArrowUp], pan() needs to be called with an offset of (-100, -150).
However, since I do not know how much the diagram has already been moved, I cannot set the absolute offset required.
I have seen that pan() returns the current offset when being called without arguments, but this is not documented. Is this safe to use for that purpose or is there a better alternative? If yes, the documentation should be updated.
Chart Series provide a toggleVisibility() method that allows to hide some data points of the series (or all of them) from the user. However, setting the first series to invisible breaks the chart's keyboard navigation.
This DOJO demonstrates the behavior: For the sake of simplicity, the first of the two series is toggled invisible right after the chart is rendered, but this may happen at any other point in time. Click anywhere in the DOJO's output area. Press TAB to focus the chart. The following error is logged in the browser console:
Uncaught TypeError: Cannot read properties of undefined (reading 'options') at init.focusVisual (kendo.all.min.js:9:4230266) at init._focusElement (kendo.all.min.js:9:4410242) at init._focusFirstPoint (kendo.all.min.js:9:4409100) at init._focus (kendo.all.min.js:9:4407358)
If the ColorPicker tools in the Editor are configured to render a gradient, you cannot type in the HEX/RGB inputs.
The inputs are not selectable and you cannot type in them.
The inputs should be selectable so that you can type in them.
As all grids, the kendo Gantt chart's rows change their color when hovering. However, the background overlaps the border between columns and makes them disappear for the hovered row.
You can reproduce the described behavior by hovering one of the rows in this DOJO.
Bug report
Pivotgridv2 measure is not slicing the data by the second attribute when expanding
Reproduction of the problem
Open this Dojo example - https://dojo.telerik.com/zmhjamtb
Value sum is correct (sliced) for all rows:
where the second row is expanded and not correctly sliced:
Environment
jQuery: 3.4.1
Kendo UI version: 2025.1.227
Browser: [all]
I have noticed that, after switching themes, the tooltips in our application do no longer work correctly. I was able to reproduce the issue in the following two DOJOs:
The only difference between those two is the stylesheet to be loaded (line 6).
Steps to reproduce:
In step 4, the correct behavior would be displaying the tooltip in the same fashion as in step 2. However, in the faulty DOJO, it can be seen that the tooltip does not expand past the width of the text that is displayed when hovering over the green dot. This means that when displaying long tooltips after short ones, they are always wrapped unnecessarily.
A way to fix this behavior (and what's actually the difference between the two stylesheets) is to set the position on the ".k-animation-container" back to its default value "static". Usually, this value is overridden by the output of the size calculations, but during the calculations this value comes to play.
This third DOJO demonstrates the fix described above.
Please note that when using the default-ocean-blue stylesheet, the positioning of the callout seems to be broken as well.
In the Scheduler, if we have a slotTemplate and at the same time views.virtual, the resources().field in the slotTemplate always returns the same value (of the first resource).
The data-resource='#= resources().user_id #' in the slotTemplate always has the same value.
If the virtual is disabled, the data-resource='#= resources().user_id #' has a value based on the resource.
The resources should be correctly returned in the slotTemplate even if the virtual option is enabled.