I tried following the article here to delete a tile: https://docs.telerik.com/kendo-ui/controls/layout/tilelayout/add-remove
Unfortunately when I do this, the contents of the tiles is deleted. This would be ok if the contents was something hard coded but it is dynamic and changes as the user interacts with the page. I tried writing my own script to delete this which almost works, however when I hover over a tile I get a console error saying:
Uncaught TypeError: Cannot read properties of undefined (reading '0')
at init._createResizeHandle (kendo.all.js:177288:26)
at HTMLDivElement.<anonymous> (kendo.all.js:177517:72)
at HTMLDivElement.dispatch (jquery.min.js?v=82hEkGrSMJh3quMSG4f7FbngmAPLTDM63H4eNayS4Us:2:43090)
at v.handle (jquery.min.js?v=82hEkGrSMJh3quMSG4f7FbngmAPLTDM63H4eNayS4Us:2:41074)
_createResizeHandle @ kendo.all.js:177288
(anonymous) @ kendo.all.js:177517
dispatch @ jquery.min.js?v=82hEkGrSMJh3quMSG4f7FbngmAPLTDM63H4eNayS4Us:2
v.handle @ jquery.min.js?v=82hEkGrSMJh3quMSG4f7FbngmAPLTDM63H4eNayS4Us:2
Show 2 more frames
kendo.all.js:177288 Uncaught TypeError: Cannot read properties of undefined (reading '0')
at init._createResizeHandle (kendo.all.js:177288:26)
at HTMLDivElement.<anonymous> (kendo.all.js:177517:34)
at HTMLDivElement.dispatch (jquery.min.js?v=82hEkGrSMJh3quMSG4f7FbngmAPLTDM63H4eNayS4Us:2:43090)
at v.handle (jquery.min.js?v=82hEkGrSMJh3quMSG4f7FbngmAPLTDM63H4eNayS4Us:2:41074)
Here is my code:
//Note: findObjectIndexByProperty is a custom function that I wrote which is not included in this snippet. It returns the index
//of the object in an array of objects.
$("#myTileLayout").on("click", ".js-remove-tile-button", function (e) {
var domElement = $(e.currentTarget).closest(".k-tilelayout-item");
var itemId = $(domElement).attr("id");
let layout = $("#myTileLayout").data("kendoTileLayout");
let itemsIndex = findObjectIndexByProperty(layout.items, "id", itemId);
let containersIndex = findObjectIndexByProperty(layout.options.containers, "id", itemId);
layout.items.splice(itemsIndex, 1);
delete layout.itemsMap[itemId];
layout.options.containers.splice(containersIndex, 1);
$(domElement).remove();
});
Hi, Lee,
Could you let me know if the remove functionality demonstrated in the docs fails if you use the logic from the Dojo in the private ticket?
I've made a slight modification to include the remove button:
https://dojo.telerik.com/@gdenchev/IjOtEHaw
If it still breaks, could you please provide me with a Dojo where I can debug it? I should be able to provide you with additional information after that.
Best Regards,
Georgi