Hi,
Having issues when attempting to parse the incoming date durring the onImport event in a Kendo Spreadsheet control. We wanted to rename the reports to the expected names if the user imports a spreadsheet with different names.
So, I came up with a function to do this, however it seems like the first sheet, when comprised of Excel references chokes. The below works fine if there are no references to other cells on other sheets.
function resetToOrigSheetNames() {
var spreadsheet = $("#spreadsheet").data("kendoSpreadsheet");
var data = spreadsheet.toJSON();
var json = JSON.stringify(data, null, 2);//<--[OOF] Uncaught RangeError: Invalid string length! Chokes on a sheet with references.
var ssData = JSON.parse(json);
var importData = "";
var sheetcount = ssData.sheets.length;
var sheets = spreadsheet.sheets();
let listData = [];
listData = _view.get("currentLayoutDataList"); //We will use this later for sheet names etc...
//First load the Sheet types:
let i = 0;
$.each(listData, function (index, value) {
if (i < sheetcount && (value.itemType === "REPORT" || value.itemType === "CUSTOM")) {
spreadsheet.renameSheet(spreadsheet.sheets()[i], defineName(value));
console.log("NAME", spreadsheet.sheets()[i]._name );
i++;
}
});
spreadsheet.refresh();
}I have the above being called in the excelImport event handler.
It's throwing an exception on the JSON.stringify():
Which according to JavaScript documentation means the string being created… is too big. I use the below code all over the application for different things:
var data = spreadsheet.toJSON();
var json = JSON.stringify(data, null, 2);
var ssData = JSON.parse(json);
Was wondering if there was a way to import the actual values of the referenced cells and not the references?
Thanks!
George
Hi,
I am trying to set up calendar in my app using range selection mode.
My question would be how can I select range when I open calendar on a button click. (I have field where data is read from db, and then i should preset that data on calendar).
Second, potential bug:
if Calendar is in range selection mode (selectable="range"), change event doesn't trigger correctly. When first time clicked - value in the widget change event (this.value) equals null, and then when second one is clicked (end of range), this.value equals start of the range.
https://dojo.telerik.com/TCxOCzUl
I used this dojo.
Thank you very much.
Regards,
Vedad

I have an html page with two kendomultiselect controls initialized with a code like the following:
function msAssegnatariConoscenza_GetDataSource()
{
return new kendo.data.DataSource(
{
serverFiltering: true,
schema: {
data: function (response)
{
//...
return response;}
},
transport: {
read: {
url: "../Api/Assegnatari_SearchWithUO", //Assegnatari_Search
contentType: "application/json; charset=utf-8",
dataType: "json",
type: "POST"
},
parameterMap: function (data, type)
{
//...
return JSON.stringify(data);
}
}
}
);
}
function msAssegnatariConoscenzaInit(fIsReadOnly)
{
if (!datiSmistamento.AssConoscenza) datiSmistamento.AssConoscenza = [];
$("#field_AssConoscenza").kendoMultiSelect({
autoBind: false,
dataTextField: "Nome",
dataValueField: "ID",
minLength: 3,
delay: 500,
height: 300,
headerTemplate: '...',
tagTemplate: '...',
itemTemplate: '...',
filtering: function (e)
{
if (!e.filter || !e.filter.value)
e.preventDefault();
},
dataSource: msAssegnatariConoscenza_GetDataSource() ,
value: null,
select: function (e)
{
var dataItem = this.dataItem(e.item.index());
return selectAssegnatarioConoscenza($(this.element[0]).attr("id"), dataItem, e);
},
change: function (e) { return msAssegnatariConoscenza_changeEvent(this, e); }, //Fired when value changed by the user, not form code.
dataBound: function (e) { e.sender.listView.focusFirst(); return false; }
});
}
When I delete an element in one control, I have to add it to the other control.
On the change event of the first I set the new value of the second with the following code:
msAssegnatariConoscenza.value([]); msAssegnatariConoscenza.dataSource.data(datiSmistamento.AssConoscenza); msAssegnatariConoscenza.value(datiSmistamento.AssConoscenza.map(avmAss => avmAss.ID));
Can anyone tell me what I have done wrong?
We need in our application a dropdowntree which has the following properties:
the following snipped is the configuration of the datasource:
let hDataSource = new kendo.data.HierarchicalDataSource({
transport: {
read:
function (options) {
let searchString = "";
if (options.data.filter && options.data.filter.filters.length > 0) {
searchString = "/" + options.data.filter.filters[0].value;
}
let url = SERVICE_URL;
if (searchString) {
url += searchString;
}
$.ajax({
url: url,
success: function (result) {
options.success(result);
}
});
}
},
schema: {
model: {
children: "items",
hasChildren: "childsAvailable"
}
},
serverFiltering: true
});the url provided by the SERVICE_URL variable is filtering the data when searching for nodes
when i configure the widget in the normal way everything works just fine. But when i use mvvm the browser throws the following error.
maybe somebody can help me get mvvm to work since this is how all our forms are created.

I am are trying to create a custom toolbar button with a defined SVG.
No matter what we try, we are unable to change the default SVG button.
The documentation says that the name will be used to apply a k-name class. We can then use that to apply our own SVG. How can we change the SVG on a custom button?
Example - https://dojo.telerik.com/NyxxkxYJ
The following example demonstrates how to add a custom tool button. To enable styling where toolName is the specified name in the custom tool configuration, the custom buttons get a k-toolName CSS class. The undo and redo tool names are reserved.
<div data-role="view" id="two-drawer-home" data-title="Default Report"> <header data-role="header"> <div data-role="navbar"> <a data-role="backbutton" id="back-button" class="nav-button" data-align="left">Back</a> <span data-role="view-title"></span> <a data-role="button" data-rel="drawer" href="#right-drawer" data-icon="share" data-align="right"></a> </div> </header> <a class="left-btn" data-role="button" data-rel="drawer" href="#left-drawer" data-icon="nav"></a> <div data-role="content">Main Content Goes Here </div> </div> <div data-model="app.Menus" data-init="app.Menus.init" data-role="drawer" id="left-drawer" style="width: 270px" data-title="Select a Report" data-views="['two-drawer-home']"> <header data-role="header"> <div data-role="navbar"> <span data-role="view-title"></span> </div> </header> <div id="zones" class="k-content"> <div class="configuration-horizontal"> <div class="config-section"> <div data-role="treeview" data-drag-and-drop="false" data-text-field="Name" data-bind="visible: isVisible, source: zones, events: { select: onSelect }"></div> </div> </div> </div> </div> <div data-role="drawer" id="right-drawer" style="width: 80px" data-title="Share" data-position="right" data-views="['two-drawer-home', '/kendo-ui/mobile/m/drawer/two-way-drawers.html']"> <header data-role="header"> <div data-role="navbar"> <span data-role="view-title"></span> </div> </header> Filters will appear here </div>
Hello,
I have a question. After updating Kendo UI from version 2017.2.621 to 2017.3.1018, a problem occurred. The checkbox functionality in the grid, which previously had no issues, is no longer working. When I click the checkbox, nothing happens.
Hi,
How can I replace multiselect item remove icon with the old one? The new icon is svg icon. My version is 2024.3.1015
new icon
old icon
Hi,
I am attempting to update our current version of Kenduo UI for Jquery from 2023.1.117 to 2024.4.1112.
I have downloaded the commercial release zip and have updated the references to the js and css files (as I have done with previous upgrades), however I am experiencing lots of styling issues for font sizes and layout across inputs ans widgets.
Firstly, the text size is much smaller for inputs and widgets.
The display of widgets on different browsers is inconsistent (for example the calendar widget is being cut off on FireFox, but is spanning the whole screen on Chrome - screenshots attached).
Any ideas what could be causing this?