or
3 answers
349 views
Hi everyone,
is there a possibility to display SVG-Code in the drop-down list of a split-button in a toolbar. When i try to set the text attribute of the button the SVG source-code gets displayed
regards
Frank
Martin
Telerik team
answered
on
27 May 2022
1 answer
164 views
Hi,
In this demo: https://demos.telerik.com/kendo-ui/scheduler/timeline
How can I elegantly get field value that is DropDownList type in customize validation function , for example: roomId or attendees.
Thank you very much for your help.
Dimitar
Telerik team
answered
on
26 May 2022
1 answer
191 views
Hi,
In this demo: https://demos.telerik.com/kendo-ui/scheduler/timeline
I have a drives me crazy question:
How can I code field's change event function in edit-form , for example: roomId or attendees.
Thank you very much for your help.
Dimitar
Telerik team
answered
on
26 May 2022
1 answer
318 views
Hi,
In this demo: https://demos.telerik.com/kendo-ui/scheduler/timeline
I have a drives me crazy question:
For example, I code customize validation function for field roomId and field attendees in schema-model-fields. In roomId customize validation function, How can I manual programming trigger attendees's customize validation function for edit-form?
Thank you very much for your help.
Ianko
Telerik team
answered
on
26 May 2022
1 answer
511 views
Hello,
http://dojo.telerik.com/orOBogAX
<link rel="stylesheet" href="https://kendo.cdn.telerik.com/2022.2.510/styles/kendo.common.min.css">
<link rel="stylesheet" href="https://kendo.cdn.telerik.com/2022.2.510/styles/kendo.rtl.min.css">
<link rel="stylesheet" href="http://kendo.cdn.telerik.com/2016.2.607/styles/kendo.silver.min.css"/>
<link rel="stylesheet" href="https://kendo.cdn.telerik.com/2022.2.510/styles/kendo.mobile.all.min.css">
<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/kendo.all.min.js"></script>
<link rel="stylesheet" href="https://kendo.cdn.telerik.com/2022.2.510/styles/kendo.default.min.css">
<script src="https://kendo.cdn.telerik.com/2022.2.510/js/jszip.min.js"></script>
I added this code in index.html Anguler project
this code in componet html
<div id="example" ng-app="KendoDemos">
<div ng-controller="MyCtrl">
<kendo-spreadsheet k-scope-field="spreadsheet" k-sheets="sheets" ></kendo-spreadsheet>
<!-- OR -->
<!--<div kendo-spreadsheet="spreadsheet" k-sheets="sheets" ></div>-->
</div></div>
<script>
angular.module("KendoDemos", [ "kendo.directives" ])
.controller("MyCtrl", function($scope){
$scope.sheets= [{ name: "Sheet1" }, { name: "Sheet2" }];
$scope.$on("kendoWidgetCreated", function(event, widget){
// the event is emitted for every widget; if we have multiple
// widgets in this controller, we need to check that the event
// is for the one we're interested in.
if (widget === $scope.spreadsheet) {
var sheets = $scope.spreadsheet.sheets();
$scope.spreadsheet.activeSheet(sheets[1]);
}
});
});
</script>
I get a error. I want to run a spreadsheet in angular how can I do this?
ERROR TypeError: Cannot read properties of undefined (reading 'nativeElement')
at MaterialComponent.ngAfterViewInit (material.component.ts:28:28)
at callHook (core.mjs:2551:1)
at callHooks (core.mjs:2520:1)
at executeInitAndCheckHooks (core.mjs:2471:1)
at refreshView (core.mjs:9566:1)
at refreshComponent (core.mjs:10692:1)
at refreshChildComponents (core.mjs:9291:1)
at refreshView (core.mjs:9545:1)
at refreshEmbeddedViews (core.mjs:10646:1)
at refreshView (core.mjs:9519:1)
defaultErrorLogger @ core.mjs:6494
handleError @ core.mjs:6541
(anonymous) @ core.mjs:26589
invoke @ zone.js:372
run @ zone.js:134
runOutsideAngular @ core.mjs:25507
tick @ core.mjs:26589
(anonymous) @ core.mjs:26434
invoke @ zone.js:372
onInvoke @ core.mjs:25608
invoke @ zone.js:371
run @ zone.js:134
run @ core.mjs:25462
next @ core.mjs:26433
next @ Subscriber.js:91
_next @ Subscriber.js:60
next @ Subscriber.js:31
(anonymous) @ Subject.js:34
errorContext @ errorContext.js:19
next @ Subject.js:27
emit @ core.mjs:22483
checkStable @ core.mjs:25530
onHasTask @ core.mjs:25625
hasTask @ zone.js:426
_updateTaskCount @ zone.js:447
_updateTaskCount @ zone.js:274
runTask @ zone.js:195
drainMicroTaskQueue @ zone.js:585
Promise.then (async)
nativeScheduleMicroTask @ zone.js:561
scheduleMicroTask @ zone.js:572
scheduleTask @ zone.js:396
scheduleTask @ zone.js:221
scheduleMicroTask @ zone.js:241
scheduleResolveOrReject @ zone.js:1265
then @ zone.js:1450
bootstrapModule @ core.mjs:26214
14431 @ main.ts:11
__webpack_require__ @ bootstrap:19
__webpack_exec__ @ main.ts:12
(anonymous) @ main.ts:12
__webpack_require__.O @ chunk loaded:23
(anonymous) @ main.ts:12
webpackJsonpCallback @ jsonp chunk loading:34
(anonymous) @ main.js:2
angular.min.js:7 Uncaught Error: [$injector:modulerr] http://errors.angularjs.org/1.7.9/$injector/modulerr?p0=KendoDemos&p1=Error%3A%20%5B%24injector%3Anomod%5D%20http%3A%2F%2Ferrors.angularjs.org%2F1.7.9%2F%24injector%2Fnomod%3Fp0%3DKendoDemos%0A%20%20%20%20at%20https%3A%2F%2Fkendo.cdn.telerik.com%2F2022.1.412%2Fjs%2Fangular.min.js%3A7%3A168%0A%20%20%20%20at%20https%3A%2F%2Fkendo.cdn.telerik.com%2F2022.1.412%2Fjs%2Fangular.min.js%3A26%3A453%0A%20%20%20%20at%20b%20(https%3A%2F%2Fkendo.cdn.telerik.com%2F2022.1.412%2Fjs%2Fangular.min.js%3A25%3A478)%0A%20%20%20%20at%20https%3A%2F%2Fkendo.cdn.telerik.com%2F2022.1.412%2Fjs%2Fangular.min.js%3A26%3A227%0A%20%20%20%20at%20https%3A%2F%2Fkendo.cdn.telerik.com%2F2022.1.412%2Fjs%2Fangular.min.js%3A42%3A496%0A%20%20%20%20at%20r%20(https%3A%2F%2Fkendo.cdn.telerik.com%2F2022.1.412%2Fjs%2Fangular.min.js%3A8%3A76)%0A%20%20%20%20at%20g%20(https%3A%2F%2Fkendo.cdn.telerik.com%2F2022.1.412%2Fjs%2Fangular.min.js%3A42%3A344)%0A%20%20%20%20at%20fb%20(https%3A%2F%2Fkendo.cdn.telerik.com%2F2022.1.412%2Fjs%2Fangular.min.js%3A46%3A460)%0A%20%20%20%20at%20c%20(https%3A%2F%2Fkendo.cdn.telerik.com%2F2022.1.412%2Fjs%2Fangular.min.js%3A22%3A57)%0A%20%20%20%20at%20Uc%20(https%3A%2F%2Fkendo.cdn.telerik.com%2F2022.1.412%2Fjs%2Fangular.min.js%3A22%3A370)
at angular.min.js:7:168
at angular.min.js:43:285
at r (angular.min.js:8:76)
at g (angular.min.js:42:344)
at fb (angular.min.js:46:460)
at c (angular.min.js:22:57)
at Uc (angular.min.js:22:370)
at Ae (angular.min.js:21:45)
at HTMLDocument.<anonymous> (angular.min.js:348:494)
at i (jquery-1.12.3.min.js:2:27449)
(anonymous) @ angular.min.js:7
(anonymous) @ angular.min.js:43
r @ angular.min.js:8
g @ angular.min.js:42
fb @ angular.min.js:46
c @ angular.min.js:22
Uc @ angular.min.js:22
Ae @ angular.min.js:21
(anonymous) @ angular.min.js:348
i @ jquery-1.12.3.min.js:2
fireWith @ jquery-1.12.3.min.js:2
ready @ jquery-1.12.3.min.js:2
K @ jquery-1.12.3.min.js:2
index.js:551 [webpack-dev-server] Live Reloading enabled.
DevTools failed to load source map: Could not load content for https://kendo.cdn.telerik.com/2022.1.412/js/angular.min.js.map: HTTP error: status code 404, net::ERR_HTTP_RESPONSE_CODE_FAILURE
Martin
Telerik team
answered
on
26 May 2022
3 answers
815 views
Hello!
I wonder if there is a possibility to create an option ala "select all", but customize it to selecting only second-level nodes or nodes with specified ids?
Elisa
Top achievements
Rank 1
Iron
Rank 1
Iron
answered
on
25 May 2022
0 answers
296 views
Hi Team,
I am using file manager and I wanted to sort tree view elements in file manager based on some custom logic. Now by default it is sorting based on name. Is there any way to implement custom sorting?
jessen
Top achievements
Rank 1
Rank 1
asked
on
25 May 2022
1 answer
258 views
Hi,
We are using keno grid component, in one of the grid column we are appending kendo multiselect to user to select option ,on selecting we are setting other columns , on setting of other columns selected option from dropdown is going off
Scenario1: once we set the remaining columns the selected option from kendo multiselect is going off.
Scenario2: if we select second time the same option then the selected option is not going off.
Scenario3: if we add the row to the grid , the second time selected option is going off again.
can u please suggest is there anything wrong in the code.
for reference: http://dojo.telerik.com/iNaqIYEh/27
Thank you
Georgi Denchev
Telerik team
answered
on
25 May 2022
1 answer
329 views
I added a Kendo UI JQuery Editor to my page. It looks as expected when it is generated from a textarea but when it is generated from a div the toolbar pops up and floats around. I want it always visible AND fixed to the top of the editor just like on this page or on the classic editor. I found one article about it but that article didn't seem to work. My editor also needs to be resizable with an initial height of 75px. Resizing currently doesn't go any smaller than 100px. See this Dojo for the resizing problem: https://dojo.telerik.com/EXiSugUg. I have multiple editors on the page in a modal. I am generating them in a loop like so:
// html <div id="editor1"></div><div id="editor2"></div>...
let id = "editor1";
let editors = {};
editors[id] = $(`#${id}`).kendoEditor({
pasteCleanup: {
keepNewLines: true
},
resizable: {
content: true,
toolbar: true
},
tools: [
"bold", "italic", "underline", "insertUnorderedList", "insertOrderedList", "indent", "outdent", "justifyLeft", "justifyCenter", "justifyRight"
]
}).data("kendoEditor");
Martin
Telerik team
answered
on
25 May 2022
1 answer
389 views
Hello,
I try to use jquery orgChart as in the kendo example below :
https://demos.telerik.com/kendo-ui/orgchart/index
This is the html kendo code, I just changed the source of the image:
<!DOCTYPE html>
<html lang="en">
<head>
<title></title>
<link rel="stylesheet" href="styles/kendo.common.min.css" />
<link rel="stylesheet" href="styles/kendo.default.min.css" />
<link rel="stylesheet" href="styles/kendo.default.mobile.min.css" />
<script src="js/jquery.min.js"></script>
<script src="js/kendo.all.min.js"></script>
</head>
<body>
<img src="/img/bi15.png" />
<div id="example">
<div id="orgchart"></div>
<script>
var data = [
{ id: 1, name: "Gevin Bell", title: "CEO", expanded: true, avatar: "/img/bi15.png" },
{ id: 2, name: "Clevey Thrustfield", title: "COO", expanded: true, parentId: 1, avatar: "/img/bi15.png" },
{ id: 3, name: "Carol Baker", title: "CFO", expanded: false, parentId: 1, avatar: "/img/bi15.png" },
{ id: 4, name: "Kendra Howell", title: "CMO", expanded: false, parentId: 1, avatar: "/img/bi15.png" },
{ id: 5, name: "Sean Rusell", title: "Financial Manager", expanded: true, parentId: 3, avatar: "/img/bi15.png" },
{ id: 6, name: "Steven North", title: "Senior Manager", expanded: false, parentId: 3, avatar: "/img/bi15.png" },
{ id: 7, name: "Michelle Hudson", title: "Operations Manager", expanded: true, parentId: 2, avatar: "/img/bi15.png" },
{ id: 8, name: "Andrew Berry", title: "Team Lead", parentId: 5, avatar: "/img/bi15.png" },
{ id: 9, name: "Jake Miller", title: "Junior Accountant", parentId: 5, avatar: "/img/bi15.png" },
{ id: 10, name: "Austin Piper", title: "Accountant", parentId: 5, avatar: "/img/bi15.png" },
{ id: 11, name: "Dilyana Newman", title: "Accountant", parentId: 5, avatar: "/img/bi15.png" },
{ id: 12, name: "Eva Andrews", title: "Team Lead", parentId: 6, avatar: "/img/bi15.png" },
{ id: 13, name: "Kaya Nilsen", title: "Financial Specialist", parentId: 6, avatar: "/img/bi15.png" },
{ id: 14, name: "Elena Austin", title: "Team Lead", parentId: 4, avatar: "/img/bi15.png"},
{ id: 15, name: "Lora Samuels", title: "Lawyer", parentId: 4, avatar: "/img/bi15.png"},
{ id: 16, name: "Lillian Carr", title: "Operator", parentId: 7, avatar: "/img/bi15.png" },
{ id: 17, name: "David Henderson", title: "Team Lead", parentId: 7, avatar: "/img/bi15.png" }
];
$("#orgchart").kendoOrgChart({
dataSource: data
});
</script>
</div>
</body>
</html>
but the result is not displayed as expected hierarchy and it doesn't look like a tree.
am I missing something?
my result:
expected result:
Thanks in advance.
