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
my onclick event not firing after grid sort.
grid columns markup
columns: [
{
field: "", title: "", width: "150px", attributes: { "class": "ps-0" }, template: function(dataItem) {
var actionHtmlContent = '';
if (dataItem && dataItem.canEdit) {
actionHtmlContent += '<a class="btn btn-link" href="' + contactDetailLink + '/1/' + dataItem.id + '">';
actionHtmlContent += '<em class="material-icons material-edit" style="color:#0D4EA2;"></em>';
actionHtmlContent += '</a>';
}
if (dataItem && dataItem.canDelete) {
actionHtmlContent += '<a class="btn btn-link delete-button" title=" " aria-label=" " href="?AppContactID=' + encodeURIComponent(dataItem.id) + ' &handler=Delete">';
actionHtmlContent += '<em class="material-icons material-delete" style="color:#0D4EA2;"></em>';
actionHtmlContent += '</a>';
}
return actionHtmlContent;
}
},
{ field: "salutation", title: "Salutation", width: "130px" },
{ field: "fullName", title: "Full Name", width: "200px" },
code to attach onclick
$(".delete-button").on("click", function () { return confirm('Are you sure you want to proceed?'); });
my js tag has nounce, thus i can't add the event listener to the html tag itself.
after i sort the grid, when user click on the .delete-button the confirm popup is not showing