Delete tile article does not work. How do you properly delete a tile?

0 Answers 28 Views
TileLayout
Lee
Top achievements
Rank 1
Iron
Iron
Iron
Lee asked on 03 Jun 2022, 11:36 PM | edited on 03 Jun 2022, 11:37 PM

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();

    });

Georgi Denchev
Telerik team
commented on 08 Jun 2022, 11:00 AM

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

No answers yet. Maybe you can help?

Tags
TileLayout
Asked by
Lee
Top achievements
Rank 1
Iron
Iron
Iron
Share this question
or