I am working on a page that progressively adds server content as the user provides more information. So there are a lot of chunks of UI being appended and replaced in the UI. I just noticed that when I remove one div, via jquery's .remove function, the div.k-calendar-container.k-popup for some date pickers that were descendants of the div are not being removed and are accumulating at the bottom the page.
In regards to separation of concerns, at the point in my javascript that I am removing the parent element, I don't necessarily want that code to have to know that there are kendo datepickers inside or to have to care about what the contents are at all. Is there a best practice to make sure that kendo widgets are cleaned up/destroyed when they are indirectly removed from the DOM like this?
3 Answers, 1 is accepted
The kendo.destroy() method is used to clean up Kendo widgets from a container, so you can then $(container).empty() it. It will remove extra HTML (such as popups) and will delete their client objects. It leaves HTML in the container intact, though, to avoid breaking your entire page, which is why you have to clean up that HTML yourself (you probably already do that).
You can read more about the two ways to use the destroy method (per widget instance and per container) in the following article: https://docs.telerik.com/kendo-ui/intro/widget-basics/destroy.
Regards,
Marin Bratanov
Progress Telerik
Rank 1
Veteran