Hello
I am trying to save PivotGrid state for future load.But I have a problen: The expand property of row items is not changed at run time. Test here https://dojo.telerik.com/@Mzand/obIkEdAY : When the user expands an item at runtime the expand property of the returned row by dataSource.rows() is the same as what it was at initialization. Isn't it data-binded? Is there a way to get the value?
It is easy to add style to grid column cells with https://docs.telerik.com/kendo-ui/api/javascript/ui/grid/configuration/columns.attributes
How can I style the groupFooterTemplate?
Example here:

Hiya,
I was trying to hide the expand/collapse column and use the row click to expand/collapse the row detail instead. I was able to implement each individually but when I combine them the row click is no longer working.
I use the following to hide the expand/collapse column in the DataBound event:
$(".k-hierarchy-cell").remove();$(".k-hierarchy-col").remove();And something like the following to implement the row click to expand the row detail:
element.on('click','tr',function(){ $(element).data().kendoGrid.expandRow($(this));})Did I miss anything?
Cheers,
Byang

Hi all,
I'm currently trying to implement an MVC grid which contains a multi select editor template. In the DB it's stored as a comma separated list of strings, but I wish to display it as a multi select (to help the user input data) so i changed my viewmodel property to a list of a custom model. I've attempted this myself, but it doesn't appear to be posting to my controller action. If i add items, they appear to add to the datasource but dont post to the controller (come through as "nothing"), however, if i add 3 items, then remove one using the X
My bound column
columns.Bound(Function(cond) cond.Value).EditorTemplateName("MyTemplate_Value")
My customer object
Public Class TheValue Public Property MyValueID As String Public Property MyValue As StringEnd ClassMy Editor Template
@Html.Kendo().MultiSelectFor(Function(m) m).DataTextField("MyValue").DataValueField("MyValueID").Events(Sub(ev) ev.DataBound("MultiSelect_DataBound")) <style> #Value-list { display: none !important; } </style>
My javascript
var currentId = 1;function MultiSelect_DataBound(e) { $('.k-multiselect .k-input').unbind('keyup'); $('.k-multiselect .k-input').on('keyup', onClickEnter);}function onClickEnter(e) {
if (e.keyCode === 13) {
var widget = $('#Value').getKendoMultiSelect();
var dataSource = widget.dataSource;
var input = $('.k-multiselect .k-input');
var value = input.val().trim();
if (!value || value.length === 0) {
return;
}
var newItem = {
MyValueID: currentId++,
MyValue: value
};
dataSource.add(newItem);
var newValue = newItem.MyValueID;
widget.value(widget.value().concat([newValue]));
}
}
Any help would be appreciated!

<input data-role="switch" data-bind="checked:checked"/>
Hi All
I have a grid that is getting generated by means of a HTML table. I would like to know or understand how I can filter the grid data especially the Date Fields and numeric fields. I checked most of the examples, they are all based on oData data source. I did not come across any examples where date/numeric filtering is done in the grid which gets generated by means of HTML table.
Thank You in advance for your inputs.
Vijhay Devarajan.

I am running into an issue when adding a dropdownlist to my grid in my detailInit grid. When I select a row, the dropdownlists are in there, but when I select another row, then the dropdownlist's don't appear.
However, if I select the 3rd row, I get the dropdownlists appearing and they will appear in the 2nd and 1rst row, but not the fourth.
Why is this happening and how do I fix it so that regardless which row I select, that all the rows will have the dropdownlists?
Below is my testing code
<script type="text/x-kendo-template" id="EditAreaGridToolbarTemplate"> <button class="btn btn-sm btn-primary" id="btnAddNewArea"><i class="fa fa-plus"></i></button> <button id="btnDeleteArea" class="btn btn-sm btn-danger"><i class="fa fa-remove"></i></button> </script> <div id="TabEditor"></div>var dropdownData = [{ "CatalogID": 1, "NameVersion": "Catalog1" }, { "CatalogID": 2, "NameVersion": "Catalog2" }, { "CatalogID": 3, "NameVersion": "Catalog3" }, { "CatalogID": 4, "NameVersion": "Catalog4" },];$(document).ready(function() { //#region Data var data2 = [{ "RoomID": 1, "RoomName": "Room 1", "Areas": [{ "id": 1, "AreaName": "Area 1" }, { "id": 10, "AreaName": "Area 10" }] }, { "RoomID": 2, "RoomName": "Room 2", "Areas": [{ "id": 2, "AreaName": "Area 2" }, { "id": 20, "AreaName": "Area 20" }] }, { "RoomID": 3, "RoomName": "Room 3", "Areas": [{ "id": 3, "AreaName": "Area 3" }, { "id": 30, "AreaName": "Area 30" }, { "id": 35, "AreaName": "Area 35" }] }, { "RoomID": 4, "RoomName": "Room 4", "Areas": [{ "id": 4, "AreaName": "Area 4" }, { "id": 40, "AreaName": "Area 40" }] } ]; //#endregion ShowTabEditor(data2);});function ShowTabEditor(data) { $('#TabEditor').kendoGrid({ dataSource: { data: data }, schema: { model: "RoomID", fields: { RoomID: { editable: false, hidden: true }, RoomName: { editable: false, type: "string", hidden: false }, AreaCount: { editable: false, type: "number", hidden: false } } }, columns: [{ field: "RoomID", title: "RoomID", hidden: true }, { field: "RoomName", title: "RoomName", hidden: false }, { field: "AreaCount", title: "AreaCount", hidden: false } ], selectable: "row", //change: onTabEditorRowSelect, //detailTemplate: kendo.template($("#TabAreaTemplate").html()), detailInit: TabEditorDetailInit, detailExpand: function(e) { this.select(e.detailRow.prev()); this.collapseRow(this.tbody.find('> tr.k-master-row').not(e.masterRow)); } }).data("kendoGrid");}function TabEditorDetailInit(e) { //var masterRow = e.masterRow; //var roomID = e.data.RoomID; $("<div id='EditAreaGrid' />").appendTo(e.detailCell).kendoGrid({ scrollable: true, sortable: true, selectable: "row", filterable: false, toolbar: kendo.template($("#EditAreaGridToolbarTemplate").html()), columns: [{ title: "id", field: "id", hidden: true }, { field: "AreaName", title: "Area Name", width: "20px", template: "<div >#=AreaName #</div>" }, { title: "Catalog", field: "Catalog", template: "<input class='edit-area-catalog-dropdown' type='text' />", width: "40px", editable: false }], editable: { mode: "incell", confirmation: false }, dataSource: { data: e.data.Areas, schema: { model: { fields: { id: { nullable: true }, AreaName: { nullable: true, editable: true }, Catalog: { editable: false } } } } }, dataBound: function(e) { abindCatalogDropDownInCellProcess(); } });}function abindCatalogDropDownInCellProcess() { $("#EditAreaGrid").data("kendoGrid").tbody.find("td input.edit-area-catalog-dropdown").each(function() { $(this).kendoDropDownList({ dataTextField: "NameVersion", dataValueField: "CatalogID", optionLabel: "Select Catalog...", dataSource: { transport: { read: function(options) { if (dropdownData.length > 0) { options.success(dropdownData); return; } options.success(dropdownData); } } }, select: function(e) { var grid = $("#EditAreaGrid").data("kendoGrid"); var dataItem = grid.dataItem(grid.select()); var drpDataItem = this.dataItem(e.item); } }); });}Hi, the latest feature to allow an overnight view is great and I have used it for shift working from 7PM to 7AM.
Is there a way to highlight the midnight timeline and make it bolder/ different colour.. similar to the attached visual (albeit with a straighter line :) )
Hi.
The REST-Api server is written with flask and python.
and Server's request parser require the following dictionary format asking PUT method.
{
"uuid": 15,
"subject": "newfile uploaded..",
"filepath": "newfile.zip",
"description": "ev3 install version : 1.4.1",
"count": 3
}
I've tested GET/POST/PUT/DEL method with POSTMAN and that's no problems.
However, When I ask PUT method using 'kendoui-gridedit-popup' there occurs some prolblems.
I've found the reason of it. That's the parameterMap's object and its format is not matched with my flask server's requirement.
when I request 'EDIT(PUT method)' with the kendoui library, the sending object's message is like the followings.
nodes: [{"count":1,"description":"ev3 install version : 1.4.1","filepath":"moba.zip","subject":"mobasss","uuid":3}]
Um...
I wish to convert the format matching with my server and I have to remove '[', ']' .
How can i do that? Let me know the solution.
$(document).ready(function () { var crudServiceBaseUrl = "http://www.learnsteam.kr:5000", dataSource = new kendo.data.DataSource({ transport: { read: { url: crudServiceBaseUrl + "/nodes", dataType: "json" }, update: { url: crudServiceBaseUrl + "/node/put", dataType: "json", type: "POST" }, destroy: { url: crudServiceBaseUrl + "/node/delete", dataType: "json", type: "POST" }, create: { url: crudServiceBaseUrl + "/node/post", dataType: "json", type: "POST" }, parameterMap: function (options, operation) { if (operation !== "read") { console.log("Here parameterMap"); console.log(options); return {nodes:kendo.stringify(options.models)}; //return json.stringify(options.models); //msg==> nodes: [{"count":1,"description":"ev3 install version : 1.4.1","filepath":"moba.zip","subject":"mobasss","uuid":3}] } } }, batch: true, pageSize: 10, schema: { data: "nodes", model: { id: "uuid", fields: { uuid: { editable: false, nullable: true }, subject: { validation: { required: true } }, filepath: { type: "string", validation: { required: true } }, description: { type: "string" }, count: { type: "number", validation: { min: 1, required: true } } } } } }); $("#grid").kendoGrid({ dataSource: dataSource, pageable: true, height: 550, toolbar: ["create"], columns: [ { field: "uuid", title: "ID", width: "120px" }, { field: "subject", title: "제목", width: "400px" }, { field: "filepath", title: "파일 경로", width: "400px" }, { field: "description", width: "120px" }, { field: "count", width: "100px" }, { command: ["edit", "destroy"], title: " ", width: "250px" }], editable: "popup" }); });
