There are several problems when extending a widget .
In this example we have extended the DropDownTree.
selectedProductId: [{ id: "a" }, { id: "c" }],
and not
selectedProductId: ["b", "c"]
So some properties are supported and other that have been added later not.
I present you the source code (https://dojo.telerik.com/ewewERiD)
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Untitled</title>
<script src="https://code.jquery.com/jquery-1.12.3.min.js"></script>
<script src="https://kendo.cdn.telerik.com/2022.2.510/js/angular.min.js"></script>
<script src="https://kendo.cdn.telerik.com/2022.2.510/js/jszip.min.js"></script>
<script src="https://kendo.cdn.telerik.com/2022.2.510/js/kendo.all.min.js"></script>
<link rel="stylesheet" href="https://kendo.cdn.telerik.com/2022.2.510/styles/kendo.default-ocean-blue.min.css">
</head>
<body>
<input id="dropdowntreeExt" data-bind="value: selectedProductId">
<script>
(function ($) {
var kendo = window.kendo,
ui = kendo.ui,
DropDownTree = ui.DropDownTree;
var DemoDropDownTree = DropDownTree.extend({
init: function (element, options) {
DropDownTree.fn.init.call(this, element, options);
$(element).parent().addClass("k-picker-solid k-picker k-rounded");
},
options: {
name: "DemoDropDownTree",
checkboxes: true,
fillMode: "flat"
}
});
ui.plugin(DemoDropDownTree);
})(jQuery);
var viewModel = kendo.observable({
selectedProductId: [{ id: "a" }, { id: "c" }],
//selectedProductId: ["b", "c"],
products: [
{ id: "a", name: "Coffee" },
{ id: "b", name: "Tea" },
{ id: "c", name: "Juice" }
]
});
kendo.bind($("#dropdowntreeExt"), viewModel);
//kendoDemoDropDownTree
//kendoDropDownTree
$("#dropdowntreeExt").kendoDemoDropDownTree({
valuePrimitive: true,
dataTextField: "name",
dataValueField: "id",
//checkboxes: true,
dataSource: viewModel.products//,
//fillMode: "flat"
});
alert($("#dropdowntreeExt").data("kendoDemoDropDownTree").options['fillMode']);
</script>
</body>
</html>
(!) This also applies in the latest versions as well (2022R2 and 2022R3).
2. if you place the properties in kendoDropDownTree, everything works well and the datasource also accepts the format selectedProductId: ["b", "c"]
3. Many options, like autoWidth property, don't apply in extended widgets (i.e. MultiSelect, DropDownList, DropDownTree etc).
4, In DropDownTree for the extended widget, valuePrimitive: true is not applicable. Instead of returning an array of the selected keys, it returns an array of the entire item.
Hi Team,
I'd like to request that Kendo UI adds Data Matrix codes to the Kendo UI Library.
Thank you!
basically based on (it will work till you change the font size settings in the browser (chrome://settings/appearance -> front size), it will lead to )
https://www.telerik.com/forums/image-only-on-command-buttons
and (without text, but without tooltip too)
http://dojo.telerik.com/@Iliana/aJeme
would be great to have such buttons out of the box
When the WebPack 4 is used with Kendo version 2022.2.802 the following error is thrown in the console:
webpack_modules[moduleId] is not a function
Open the attached sample project
webpack-demo-wb4.zip
Run 'npm install' and 'npm start' and check the browser console.
An error: webpack_modules[moduleId] is not a function is thrown .
There should be no error and the app should run without any issues with Kendo version 2022.2.802 and WebPack 4
If you create a spreadsheet in excel and just have the below formula - it locks up when you activate the sheet.
Or if you use the kendo spreadsheet and paste this into a cell, it also locks up.
Issue Description:
Screen reader user will get confused if incorrect narration is provided on the controls.
Test Environment:
OS : Windows 10
Version: 2004(OS Build 21292.1)
Browser : Anaheim Dev (Version 89.0.760.0 (Official build) (64-bit))
URL: https://docs.telerik.com/kendo-ui/api/javascript/ui/numerictextbox/methods/min
Screen reader: Narrator.
Repro steps:
1. Open the above-mentioned URL in browser there's example code for the Numeric text box feature.
2. Now, navigate to the 'Open in Dojo' and via tab key and run the program.
3. Now move the focus to the Text box.
4.Verify whether the Narrator announce min 0 and max 0.
Actual Results:
Screen reader announces the incorrect information as "Min 0 and Max 0" when the focus lands on "from" or "to" spin button's. Currently min and max both the value's are announced as 0.
Expected results:
Screen reader should announces the relevant information when focus is on 'From' or 'to' spin button. It should be announced "Min value as 0" and "max value as per design"
Additional Notes:
1. Same when focus first lands on the opened dialog after activating build button it is announced as table which is incorrect.
2. Same issue observed with every spin button and dropdown controls.
Build Dates & Run Dates range picker don't highlight days
Pre-Requisites (if any)
1. Go to system settings.
2. Navigate to 'Accessibility' and activate it.
3. Navigate to 'Contrast theme' and activate it.
4. Select 'Desert/Aquatic' High Contrast theme in the combo box.
Repro-Steps:
1. Open URL PowerGates Graph in Edge Dev.
2. Navigate to Build Date dropdown button using tab key and activate it.
3. Navigate to the ‘Within range ’calendar picker button and activate it.
4. Observe that issue.
Actual Result:
The Build Dates & Run Dates range picker both don't highlight the currently selected date does not outline the current date, as it does without contrast. Occurs in both Aquatic (High Contrast Black) and Desert (High Contrast White) modes.
After applying filter or page number, the table content gets changed but the screen reader didn't inform about the same.
Repro-Steps:
Actual Result:
After performing below action's, the table content gets changed but the narrator didn't announce about the content change:
User Impact:
Hi,
The percent complete column does not work! If you use any other gantt product (including Microsoft project). When you enter the % complete, it's between 0 and 100, which is a universal standard around the world. % complete is never between 0 and 1. Please correct the Gantt tool to use the universal standard.
The usability of product will be much improved and users will like it.
Thank you!
David
Mentioned in package.json: "typings": "index.d.ts", but the file is missing.
Package: @progress/kendo-ui@2022.2.621
I would like to have the possibility to globally change the default styling options of all the widgets with a single declaration. Something like kendo.ui["all"].fn.options["size"] = "small";
The article below demonstrates how the style options can be changed per widget. I would like to be able to change the default style options globally for all the widgets.
Regards
Missing Anti-CRSF tokens trigger security alerts when testing for security compliance with OWASP ZAP.
The "Classic" SASS theme for Kendo UI (v. 5.4.0) provides the $enable-transitions variable. I expected it to behave consistent with other similar variables like $enable-rounded which means that when it is set to false, no transistion properties would be set.
However, the following elements always have a transition property set, no matter what the value of $enable-transitions is:
Is this a bug or did I understand the meaning of $enable-transitions wrong?
Hello,
I'm looking to find a way to hide the Table tab and Cee tab on the Table Wizard. Is there a way to do this?
Thanks,
Sunny Carrandi
Files are missing when trying to generate a script file for CircularProgressBar only through the Custom Download Tool.
There are missing files in the exported custom file.
All necessary files should be included in the custom script file.
The Kendo UI Popup's "collision" option allows to specify how its positioning algorithm should handle situations where there is not enough space. When "collision" is set to "flip" and there is not enough space to display the popup where it was configured to be displayed (via origin and position), it flips to the other side of its anchor (documented here). If there is no space on the other side either, it flips back to the original position.
I've created an example situation where this happens in this DOJO. You might have to resize the browser window a bit to make the content on either side of the input smaller than the popup's width. As you can see, the position of the popup now is the least fortunate one:
One might think I could set the popup's width to "min-content" via CSS to force wrapping, but this always wraps the content and wherever possible. Is there any way to make the popup's content wrap, but only if necessary?
Hi
I found bug into the Items of Tab component.
When you create Tab and write 3 TabItems for it, all of the component are correct but when you want create other tab into the first or second part of TabItem with 2 tabitems, you will expect to see one main Tab with 3 TabItems and other Tab with 2 Tabitems into the first tabItem of first Tab. But you will see one Tab with 5 Tabitems So main Tab merge all of TabItems with together.
<Tab id="mainTab">
<TabItem id="item1">
<Tab id="childTab">
<TabItem id="childItem1">
Content 1
</TabItem>
<TabItem id="childItem2">
Content 2
</TabItem>
</Tab>
</TabItem>
<TabItem id="item2">
Content 2
</TabItem>
<TabItem id="item3">
Content 3
</TabItem>
</Tab>
Thanks for solving this problem or for guiding me.
The "Classic" SASS theme for Kendo UI (v. 5.4.0) provides the $kendo-chip-spacing variable that defines the space between the text and the icon of the chip. This styling is e.g. used in the MultiSelect widget.
However, one cannot override its default value using the approach described in the documentation for SASS themes since the variable definition is missing the "!default" part (see the source file at line 8).
The problem described happens for multiple controls. For the sake of simplicity, I'll stick with the DropDownList.
As documented here, the DropDownList's "fillMode" option supports "null" as value. However, the corresponding TS typings file does not allow null. The same is true for the "rounded" and "size" options as you can see in the snippet below that was copied from "index.d.ts".
interface DropDownListOptions {
fillMode?: string | undefined;
rounded?: string | undefined;
size?: string | undefined;
}
Note: parts of the code were omitted for brevity's sake.
A (temporary) workaround is to trick the typing system by casting manually:
fillMode: null as unknown as string | undefined