Rank 2
Iron
Iron
Iron
Hi,
Need to figure out the proper way to attach a new sheet. to the kendoSpreadsheet's option: sheets. I tried the below code:
$(document).ready(function () {
//render and initialize kendoSpreadsheet:
$("#spreadsheet").kendoSpreadsheet({
columns: 20,
rows: 200,
toolbar: true,
sheetsbar: true,
sheets: mySheets,
width: "100%"
});
//render and initialize kendoButton:
$("#load-new-sheet-btn").kendoButton({
icon: "forward",
themeColor: "primary",
click: swapSheets // want to render new set of sheets. Is this possible?
});
});
//assign a different JavaScript object to the sheets: option parameter (this doesn't seem to refresh the spreadsheet component/control:
function swapSheets()
{
var currSpreadSheet = $("#spreadsheet").data("kendoSpreadsheet");
console.log("BEFORE clearing sheets: currentSpreadSheet contents: ", currSpreadSheet.options.sheets)
currSpreadSheet.options.sheets = mySheetsTwo;
console.log("AFTER clearing sheets: currentSpreadSheet contents: ", currSpreadSheet.options.sheets);
currSpreadSheet.refresh();
}
You can see the whole code in action here in the Dojo:
Spreadsheet Demo Swapping Sheets | Kendo UI Dojo (telerik.com)
Also, my requirements want to load a stylized formatted sheet (ergo probably a sheet object), and X number of sheets with raw data…with a different dataSource associated to those raw data sheets.
The ultimate goal is to load data into a sheet object in from an API without rerendering the entire page or destroying the current spreadsheet component (and creating a new one). Most importantly, or we can constrain the question to how to point sheets: to a new JSON sheet structure.
Here is a screen shot of what is happening:
It seems like I can re-assign the sheets object, but refreshing or binding the new sheets object is not being done successfully.
Hope this all makes sense,
George
2 Answers, 1 is accepted
Rank 2
Iron
Iron
Iron
Okay... for me... the missing bit was: using fromJSON:
fromJSON - API Reference - Kendo UI Spreadsheet - Kendo UI for jQuery (telerik.com)
The code looks like this:
$("#load-new-sheet-btn").kendoButton({
icon: "forward",
themeColor: "primary",
click: () => {
// Grab the sheet
var currSpreadSheet = $("#spreadsheet").data("kendoSpreadsheet");
currSpreadSheet.fromJSON({
sheets: mySheets2
});
currSpreadSheet.refresh();
}
});Seemed like it worked at first. Only downside, now is if I click the button again I get this:
Hopefully I can use something like this to load complete sheets from an API... and maybe if I load a different sheet it won't do that. Will keep you posted.
--George
Hi George,
Thanks for the provided details.
I have investigated the issue and it seems like a bug in the Spreadsheet component.
I have logged a bug report in our Feedback Portal where you can track the progress of the task.
As a token of gratitude, I will increase your Telerik points.
Regards,
Yordan
Progress Telerik