I had implemented this example: https://dojo.telerik.com/omIxeDUx
When I'm using kendo scheduler with view "Agenda", I need to separate events on same date by group, so I'm using the resources + group option.
With that said, I'm having problem when I need to get the selected event on change event trigger. But for some reason, depending on which event's row you select, the e.events[0] attribute is returning another event, which is not the selected one.
I'm trying to find what I'm doing wrong, the example alerts to window the meetingID of e.events[0] when change event triggers. If you see by the description of event, the ID is different.
Can anyone help me with this problem?
EDIT:
If you are experiencing the same problem, here is a workaround. I'd notice that I can get the selected item by the UID of the selected row, and just ignore the e.events. Here is the following implementation: https://dojo.telerik.com/omIxeDUx/7 (notice that depending on the version you using, the "class" of selected item may be "k-state-selected" instead of "k-selected")
change: function (e) {
var selected = document.querySelector(".k-scheduler-content tr.k-selected");
if (selected) {
var data = $(selected).find("[data-uid]").data();
var selectedItem = this.dataSource.getByUid(data.uid);
alert("Kendo event: " + e.events[0].meetingID + "\nSelected event: " + selectedItem.meetingID);
}
}
Best regards,

I'm specifically working with the scheduler, however I believe this applies to any MVVM items.
When double click an event in the scheduler, my editor template is rendered and Kendo binds this to the event being edited. This happens for "free" as I do not do this. Consider this element:
<div data-container-for="title">
<input type="text" data-role="textbox" name="title" required="required" data-bind="value:title" />
</div>The binding to title works perfectly fine and I see my value.
Next, my event has a CategoryId which tags the event and what it is. This is a property I have added. Let me point out that if I replace title above with CategoryId, the integer value of the category displays. So this value is known and part of the bound object. However, I am using a very custom templated dropdown for this.
<div data-container-for="CategoryId">
<input id="CategoryId" data-bind="value: CategoryId, source: categoriesDataSource" data-role="dropdownlist" data-auto-width="true"
data-header-template="categorySearchHeaderTemplate" data-template="categorySearchTemplate" data-text-field="Description"
data-value-field="Id" data-auto-bind="false" />
</div>Hopefully this makes sense. My categories have an Id and a Description. There is a list of them. The event has a CategoryId which holds the value of what category is selected. However this element has its own datasource! Note the data-bind.
// This datasource is created and then kendo.bind() is called to bind to my dropdown
var categoriesViewModel = kendo.observable({
categoriesDataSource: new kendo.data.DataSource({
data: jsonSerializedCategories
})
});This drop down works perfectly fine for templates and for the elements in it. See screenshot below. But the value binding does not work. This is obviously because I had to set my own datasource on it. The value is not found in that datasource; it's in the one Kendo generated and applied to the popup. What is the proper way to set this up? The value is in one datasource and the elements here are in the other one I created.
Hy This code is part of my grid.
grid._parameterMap = function (data, type) {
if (type !== "read" && data.models)
return { models: kendo.stringify(data.models) };
var warehouseCodeList = [];
var selectedWarehouse_OnPhysicalCountDefinition = '';
$.each(KendoData('mltWarehouse_OnPhysicalCountDefinition').dataItems(), function (index, value) {
selectedWarehouse_OnPhysicalCountDefinition += value.WarehouseCode + ',';
});
selectedWarehouse_OnPhysicalCountDefinition = selectedWarehouse_OnPhysicalCountDefinition.slice(0, -1);
debugger;
var parameters = {
warehouseCodeList: selectedWarehouse_OnPhysicalCountDefinition,
periodDateString: $('#dpcPeriodDate_OnPhysicalCountDefinition').val(),
Page: data.page,
PageSize: data.pageSize
}
return kendo.data.transports["odata"].parameterMap(parameters, type);
};And parameters value is
You can see that my data and that large data not going my controller becouse of that large warehouseCodeList.
Request URL: https://zzzz/Inv/yyy/xxxx/?%24inlinecount=allpages&%24format=json&warehouseCodeList=480176%2C480172%2C480003%2C480166%2C480109%2C480025%2C480090%2C480089%2C480002%2C480088%2C480061%2C480101%2C480016%2C480009%2C480095%2C480008%2C480094%2C480093%2C480006%2C480092%2C480005%2C480091%2C480004%2C480117%2C480033%2C480114%2C480060%2C480113%2C480163%2C480030%2C480059%2C2011%2C480157%2C480028%2C480045%2C480048%2C480039%2C480029%2C480120%2C480046%2C480156%2C480049%2C480072%2C480063%2C480062%2C48006100%2C480071%2C480070%2C480069%2C480068%2C480067%2C480066%2C480065%2C480064%2C480077%2C480076%2C480085%2C480084%2C480082%2C480078%2C480073%2C480075%2C480079%2C480074%2C480083%2C480127%2C480128%2C480057%2C480129%2C480058%2C480081%2C480080%2C480141%2C480132%2C480131%2C480130%2C480140%2C480138%2C480137%2C480136%2C480135%2C480134%2C480133%2C480146%2C480145%2C480154%2C480153%2C480151%2C480147%2C480142%2C480144%2C480148%2C480143%2C480152%2C480139%2C480150%2C480149%2C480106%2C480126%2C480055%2C480165%2C480167%2C480100%2C480123%2C480053%2C480096%2C480168%2C480162%2C480159%2C480158%2C480038%2C480102%2C480017%2C480013%2C480122%2C480047%2C480116%2C480032%2C480034%2C480107%2C480040%2C480118%2C480098%2C480051%2C480110%2C480026%2C480111%2C480027%2C480108%2C480103%2C480115%2C480031%2C480035%2C480087%2C480086%2C480036%2C480119%2C480112%2C480010%2C480097%2C480155%2C480124%2C480054%2C480019%2C480099%2C480104%2C480171%2C480164%2C480041%2C480042%2C480121%2C480043%2C480044%2C480014%2C480052%2C480170%2C480037%2C480050%2C480012%2C480105%2C480169%2C480161%2C480174%2C480173&periodDateString=17%2F10%2F2022&Page=1&PageSize=50 Request Method: GET Status Code: 200 OK Remote Address: 10.6.243.40:443 Referrer Policy: strict-origin-when-cross-origin Cache-Control: private Content-Length: 406 Content-Type: application/json; charset=utf-8 Date: Mon, 17 Oct 2022 11:51:47 GMT Server: Microsoft-IIS/10.0 Set-Cookie: LanguageValue=tr-TR; path=/ Set-Cookie: LanguageIndex=1; path=/ Vary: Accept-Encoding X-AspNet-Version: 4.0.30319 X-AspNetMvc-Version: 5.2 X-Powered-By: ASP.NET Accept: application/json, text/javascript, */*; q=0.01 Accept-Encoding: gzip, deflate, br Accept-Language: tr-TR,tr;q=0.9,en-US;q=0.8,en;q=0.7 Connection: keep-alive Cookie: BIGipServerASG-CP20-CORE-TEST2-443-GM.app~ASG-CP20-CORE-TEST2-443-GM_pool=1542653450.47873.0000; _hjSessionUser_744605=eyJpZCI6IjE2NjBiZDJhLWViMGUtNWY5OC04OTkxLTc4ZDM3YTEzOWJkNyIsImNyZWF0ZWQiOjE2NjQ4ODYyMDIzMDIsImV4aXN0aW5nIjp0cnVlfQ==; ASP.NET_SessionId=m3qxmvgkq4ur4tv1dcy5dg24; client_code=9931c35f-d1c6-46fd-a9ef-cced60ff1bd5; access_token=eyJhbGciOiJodHRwOi8vd3d3LnczLm9yZy8yMDAxLzA0L3htbGRzaWctbW9yZSNobWFjLXNoYTI1NiIsInR5cCI6IkpXVCJ9.eyJodHRwOi8vc2NoZW1hcy54bWxzb2FwLm9yZy93cy8yMDA1LzA1L2lkZW50aXR5L2NsYWltcy9uYW1lIjoiQVRBTEFZIiwiVXNlcklkIjoiNzQ3MSIsIk9yZ2FuaXphdGlvbkNvZGUiOiJBQyIsIkZhY2lsaXR5Q29kZSI6IjQ4IiwiT3JnYW5pemF0aW9uSWQiOiIxIiwiRmFjaWxpdHlJZCI6IjEiLCJUb2tlbkNvZGUiOiJmNWI4MDkzMC0zYjZlLTRhNmItOTIwNC1lMzg2M2M0Njg3OTAiLCJqdGkiOiJlZTQxMzkxYy04OGU1LTQ3OGUtOGIwNi03NjdmYTAxZjVmZjMiLCJhdWQiOlsiNjdEREM3M0MtQjQ4Ni00MTdBLTk1NjMtRDIzRUYxOEMzNkM3IiwiOUE3NzVEODctRkFBMS00QTNCLTlFNDAtMDRCOTcwODUxQzNFIiwiMDg0OEIwQUEtNERFNC00RjU5LTk4OTgtNTZEM0E0QTZCMTVCIiwiOTkyQTY5NzgtQ0U4OS00NkJGLTk4MkEtQzc4MzJGNDk4QkYwIiwiMDc4MEIwQzUtNzBDQi00MzcwLTk2QjktQTk1NzhDOEQ4MDI3IiwiRDFGNkUzOEItQjdGMy00RTk1LTlEMkEtNjA0QjMyRTY3MUMwIiwiMDg0OEIwQUEtNERFNC00RjU5LTk4OTgtNTZEM0E0QTZCMTVBIl0sIm5iZiI6MTY2NjAwNzAxOSwiZXhwIjoxNjY2MDUwMjE5LCJpc3MiOiI2N0REQzczQy1CNDg2LTQxN0EtOTU2My1EMjNFRjE4QzM2QzcifQ.y93UK_lZDXV5nFK71xOvmrcJSHX9oVR3TFJQDcO6x-c; NameSurname=EROL%2BATALAY; themeCp=dark; langCp=tr; langIdCp=1; PersonnelCode=XX9331; FacilityName=Ac%C4%B1badem%20Ata%C5%9Fehir%20Hst.; FacilityId=1; OrganizationName=ACIBADEM; dateTimeFormatCode=tr-TR; LanguageValue=tr-TR; LanguageIndex=1
And Finaly I try the give dataSource remote but not work .But ı can gice that data ın Ajax call.Can you Help me ?
What can I do in this situation?
I have a stacked kendo bar chart defined as follows:
$("#chart").kendoChart({
title: {
text: ""
},
legend: {
visible: false
},
seriesDefaults: {
type: "bar",
stack: true
},
series: [{
name: "Value1",
data: [-40, 32, 34, 36, 45, 33, -34, 83, 36, 37, 44, 37, 35, 36, 46],
color: "#f3ac32"
}, {
name: "Value2",
data: [19, 25, -21, 26, 28, 31, 35, 60, 31, 34, 32, 24, 40, 38, 29],
color: "#b8b8b8"
}, {
name: "Value3",
data: [17, 17, 16, -28, 34, 30, 25, 30, -27, -37, 25, 33, 26, 36, 29],
color: "#bb6e36",
labels: {
template: "#= stackValue #",
visible: true
},
}],
valueAxis: {
max: 180,
line: {
visible: false
},
minorGridLines: {
visible: true
}
},
categoryAxis: {
categories: [1952, 1956, 1960, 1964, 1968, 1972, 1976, 1984, 1988, 1992, 1996, 2000, 2004, 2008, 2012],
majorGridLines: {
visible: false
}
},
tooltip: {
visible: true,
template: "#= series.name #: #= value #"
}
});
But the sum displayed at the end of the bar is not correct in the cases where data is negative.
See the output below :
How do I get it to display the correct sum?
I want to add lunar calendar date after all scheduler dates
like in month view will add lunar calendar date after scheduer date
I want to be able to display the treemap value on the TreeMap chart.
My TreeMap Definition :
$("#treeMap").kendoTreeMap({
dataSource: {
data: [{
items: [{
name: "Seg1",
value: 54
},
{
name: "Seg2",
value: 37
},
{
name: "Seg3",
value: 9
}]
}]
},
valueField: "value",
textField: "name",
colors: [["#FF7700","#FF77FF"]]
});
I want to be able to see the values also in the chart like Seg1 : 54 , Seg2 : 37 , Seg3 : 9 . How do I do that?
I want to resize my grid that inside another grid. These grids are hierarchical. I wrote something for that but this works for second click. The processes I mentioned are seen in the pictures (firstclick, secondclick). the red circle shows extand button.
The js code block I wrote for solution but it does not work properly:
// The code inside the databound function of master grid
$("#SiparisListeleGrid td a.k-icon").click(function () { // onclick for a element that opens second grid inside the row
if ($(this).hasClass("k-i-expand")) { // if the grid is expand
// uid of tr element
var tr_UID = $(this).parents("tr").data("uid");
// master grid
var ustGrid = $("#SiparisListeleGrid").data("kendoGrid");
$(ustGrid.dataSource.data()).each(function (i, item) {
if (item.uid == tr_UID) {
var altGrid = $("#Grid_SiparisSatir_" + item.SipUstID).data("kendoGrid");
var rowCount = altGrid.dataSource.view().length;
$("#Grid_SiparisSatir_" + item.SipUstID).attr("style", "height:" + (rowCount * 40 + 125) + "px;");
$("#Grid_SiparisSatir_" + item.SipUstID + " .k-grid-content").css("height", (rowCount * 40));
$("#Grid_SiparisSatir_" + item.SipUstID + " .k-grid-content-locked").css("height", (rowCount * 40));
}
});
}
});
// This code block only works on second clicking the expan button.
// Does not recognize the second grid when clicked for the firs time
// Should I use databound for second grid? However I do not know how can I do that.Hello all,
I have the problem that my custom theme is not transferred to my application.
As code I copied the code from the tile layout example (https://demos.telerik.com/kendo-ui/tilelayout/index?_ga=2.175878118.554134959.1665135807-2026844688.1664867263&_gl=1*1inatwj*_ga*MjAyNjg0NDY4OC4xNjY0ODY3MjYz*_ga_9JSNBCSF54*MTY2NTE0Mjk5MS4yLjEuMTY2NTE0NDE5MS4wLjAuMA..) and adapted the linked script-sources to my paths.
After the script-sources i linked the css of my theme: (image0)
my theme has the following color scheme: (image1)
But now when I launch my application, the TileLayout looks like this: (image2)
When I use F12 to display the properties, for example of the donut chart, I see the following: (image3)
i do not understand, where the fill="#ff6800" comes from, since it is not even displayed in the style window of the F12 menu.
I can't get the problem solved, can anyone help me?
I am using the Scheduler and making a custom edit screen. I am following the example here.
Each scheduled event can have a category. These are selectable via dropdown. Consider the following portion of the template:
<div class="k-edit-label">
<label for="category">Category</label>
</div>
<div data-container-for="category" class="k-edit-field">
<!-- HERE IS WHERE THE DROPDOWN IS -->
</div>In the example linked, a simple <select> element is used. But I am looking to add a real Kendo dropdown, not a basic select. So I defined it as follows:
var categoryEditorDropdown = Html.Kendo().DropDownList()
.AutoBind(true)
.BindTo(categories)
.DataTextField(nameof(Category.Description))
.DataValueField(nameof(Category.Id))
.HeaderTemplate("Custom defined template which is why I need this over a select")
.OptionLabelTemplate("Custom defined template which is why I need this over a select")
.Name("category")
.ToClientTemplate();Back to my editor template, for the commented green line I tried both the following, and both gave template errors:
<div data-container-for="category" class="k-edit-field">
<!-- Both fail with a template error -->
@categoryEditorDropdown
@Html.Raw(categoryEditorDropdown)
</div>Next, I made a separate script:
<script id="editEventCategoryTemplate" type="text/x-kendo-template">
// Tried both of these and again both fail when editing the event
@categoryEditorDropdown
@Html.Raw(categoryEditorDropdown)
</script>And I updated the editor to try and use it:
<div data-container-for="category" class="k-edit-field">
#= kendo.render(kendo.template($("\\#editEventCategoryTemplate").html())) #
</div>For both tests here the page renders but then throws the same invalid template error when I try to edit an event.
How can I embed templates into each other. I need far more than category here. There are 6 templates in total needed for 6 different fields.
It seems that if you set a data-format (or other options like data-min, data-max) on a datepicker and call kendo.bind then the readonly status is lost. Is this the expected behavior, as it doesn't seem correct?
See example:
https://dojo.telerik.com/igORIMaX/2