Signal Forms are now stable with Angular@22.
It would be nice to have an ability to use all kendo widgets with new form API.
For the Kendo DatePicker, if you try to set the size on a kendo-datepicker with plain text, it will not render and give a console error of "ERROR TypeError: Cannot read properties of undefined (reading 'nativeElement')".
Errors:
// HTML
<kendo-datepicker size="small" ... />
---
But on the other hand, it does work if you create a field of type "DateInputSize" and pass that variable to the size.
Works:// TS
protected size: DateInputSize = 'small';
// HTML
<kendo-datepicker [size]="size" ... />
It would be great if you would allow loading single sheets instead of all the sheets every time. I receive data per sheet from my server.
Also the Spreadsheet fails to trigger events for:
Provide a built-in option to paste Excel data inside the Editor formatted as a table (like the KendoReact Editor):
Please repeat the following steps to reproduce this critical accessibility issue:
Expected behaviour: The disabled "Undo" button is focused so that toolbar navigation with left or right arrow keys is enabled.
Experienced behaviour: The toolbar is permanently unfocusable with keyboard navigation and the element (theme selector) before the toolbar is focused. It is no longer possible to navigate to any buttons in the toolbar with Tab or Shift+Tab at this point. This happens with any toolbar button that becomes disabled after triggering such as the "outdent" button.
NOTE: The expected behaviour actually works in the jQuery Editor (https://demos.telerik.com/kendo-ui/editor/all-tools), so the Angular Editor should be fixed to match.
it seems like for defining a custom color palette it's currently not possible to use css variables. When doing something like this:
I get a "Cannot parse color: var(--my-color)".
Am I missing something?
If not, is this feature planned to be implemented sometime soon?
For me, I absolutely need this feature since I want to maintain the link between colors used within the application. We have custom colors defined as css variables. I want those colors to appear inside the kendo colorpicker palette and when selecting one I want this css variable to be used, let's say as a colored line in a graph component. when later changing the value of the css variable the color within the graph should update. that's why converting my css variables into hex values does not work for me, since it's breaking the link.
On a sidenote - is it possibel to define a custom palette preset, like the ones available:
public palettes: string[] = [
"office",
"clarity",
"slipstream",
"basic",
"monochrome",
];
Thanks for your help.
Thomas
Hi,
We're heavily using the Scheduler component, but we've hit a problem with `slotClick` in scenarios involving multiple scheduler instances on the same page.
With two schedulers on one page, slot detection for the second scheduler (used in context-menu flows via slotByPosition) can be wrong.
Detaild repro: Stackblitz
Repro steps:
If we format kendo-datepicker to (MMMM/dd/yyyy) and if we enter number of month in input then it is not reflecting and shows month in input field.
As you can see in screenshot, I called (valueChange) event to see the changed value, I have enter 10 in month input field so it shows two value in console, first one is when 1 is press and second is when 0 is pressed after 1 so it gives null and in input field it shows month instead of October.
It is working if we enter first letter of month but it should work if we enter month in number.
Please fix this issue asap.
Thanks.
Hi Telerik Support Team,
I would like to request a feature enhancement for the Kendo UI for Angular TreeList component, specifically regarding the selection mechanisms.
Feature Request:
Please consider adding a (selectAllChange) event emitter to the <kendo-treelist-checkbox-column> component, similar to how selection events are handled or how other advanced components expose header checkbox interactions.
Use Case / Motivation:
Currently, when a user clicks the "Select-All" checkbox in the header, it is difficult to intercept this specific action efficiently to run custom business logic, perform secondary async operations, or manually update external states that depend strictly on the "all selected/unselected" toggle.
While we can listen to general selection changes on the TreeList, having a dedicated (selectAllChange) event that emits the current state (e.g., true, false, or even a custom event object) would provide much cleaner control over the application state, especially in complex data-binding scenarios.
Proposed Syntax:
<kendo-treelist-checkbox-column
[showSelectAll]="true"
(selectAllChange)="onSelectAllChange($event)">
</kendo-treelist-checkbox-column>
Hi,
When the first day of the week is changed dynamically through a custom IntlService, the Calendar weekday headers are updated, but the date cells are not repositioned. (The first day is changed as described in your guide: https://www.telerik.com/kendo-angular-ui/components/knowledge-base/calendar-first-day )
Reproduction (forked from your example): https://stackblitz.com/edit/angular-tqvypgwg
Click on "Set first day to Monday ": the weekday headers are updated to start with Monday, but the date cells remain in their previous positions.
Best regards,
Michael
This event would be useful to focus the editor on some specific scenarios like in the Dialog:
https://www.telerik.com/kendo-angular-ui/components/knowledge-base/focusing-editor-inside-dialog
It currently relies on a short delay, which might differ depending on the machine.
Hi,
in a Treeview bound to flat data (probably does not matter), if I have 3 items, and I drop the first 2 in the last, the loading indicator is stuck.
Stackblitz repro: https://stackblitz.com/edit/angular-xiwrcwsx?file=src%2Fapp%2Fapp.component.ts
Can you please take a look at it?
Best regards,
Michael
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.
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.
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
Update TreeListSelectAllCheckboxDirective to properly integrate with the expanded node detection logic or allow injection of a custom service.
Provide an override or callback to control the behavior of the "select all" checkbox manually in remote scenarios.
Configure a TreeList with hasChildren and children to fetch child nodes lazily.
Enable selection with checkbox column and showSelectAll: true.
Click any checkbox inside the TreeList.
Observe that fetchChildren() is triggered for all nodes, not just expanded ones.
Open console and click on the first cell.
https://stackblitz.com/edit/angular-e2ai4pjx?file=src%2Fapp%2Fapp.component.ts,angular.json
When you move the cursor to a new series item, the tooltip position does not move until you leave the chart area and re-enter. It changes the content based on where the cursor is pointing, but does not change the position.
import { Component } from '@angular/core';
import {KENDO_CHARTS} from "@progress/kendo-angular-charts";
@Component({
selector: 'app-root',
imports: [KENDO_CHARTS],
template: `
<kendo-chart>
<kendo-chart-legend position="bottom"></kendo-chart-legend>
<kendo-chart-series>
<kendo-chart-series-item
type="donut"
[data]="data"
field="value"
categoryField="category"
colorField="color"
[holeSize]="60"
[tooltip]="{
visible: true,
format: '{0:C0}'
}"
[highlight]="{ visible: true }"
>
</kendo-chart-series-item>
</kendo-chart-series>
</kendo-chart>
`,
})
export class App {
public data = [
{ category: "Electronics", value: 245000, color: "#0058e9" },
{ category: "Clothing", value: 189000, color: "#37b400" },
{ category: "Home & Garden", value: 156000, color: "#f59c1a" },
{ category: "Sports", value: 134000, color: "#ff6358" },
{ category: "Books", value: 98000, color: "#8c43ff" },
{ category: "Toys", value: 78000, color: "#00acc1" },
];
}
The Tooltip position only changes when you leave and reenter the Chart area. It does not change when you move the cursor from one series item to other, it updates the content displayed in the Tooltip though.
The Tooltip position should move with the cursor as seen in the screen recording below:
Because of the CSS, if a parent element has used translate (transform: translateX(0px); ) every child element under it is no longer fixed.
This causes components like kendo-dialog to be relatively positioned inside the drawer - usually cut off.
Even turning off animation still leaves the style rule.
For Angular Kendo Scheduler, if the Work week view is selected (default Mon-Fri), and Sunday is selected on the mini calendar to select the date to display - the previous week will be displayed. This is confusing, as simply toggling to Week view will then display the different, current week.
https://www.telerik.com/kendo-angular-ui/components/scheduler/views/day-week/
Expected behaviour: current week on mini calendar corresponds to the current week displayed regardless of whether full week or work week view is selected
Actual behaviour: selecting any day up until the desired "work week's start" (even if it's customized to start on e.g. Tuesday - and selecting Monday) will show previous week; switching then to full week view switches the week displayed to the one selected on mini calendar
------
Curiously, this does not happen for Kendo scheduler for JQuery (https://demos.telerik.com/kendo-ui/scheduler/index):
Ability to customize the fields control of the FilterExressions:
The multiCheckbox filter popup in the Grid sorts its distinct-value list using JavaScript's native string comparison, which orders characters by Unicode code point. This produces correct results for ASCII-only data but breaks for any locale whose alphabet includes characters outside the ASCII range (Turkish İ/Ğ/Ş/Ö/Ü/Ç, German ä/ö/ü, Czech/Polish diacritics, etc.).
The request is to sort the filter item list using locale-aware comparison (`String.prototype.localeCompare`) so that values appear in the correct alphabetical order for the active language, or provide a custom way to order the filter options.
Hi,
in the ListBoxComponent, there is the concept of custom messages, by which a "noData" message can be set:
https://www.telerik.com/kendo-angular-ui/components/listbox/api/custommessagescomponent#nodatatext
A similar concept would be beneficial for the ListView (https://www.telerik.com/kendo-angular-ui/components/listview), so that we can show a message in here as well in case no data is available.
Thanks,
Felix