Как удалить все элементы Kendo DropDownList из document.body (DOM)

Метод destroy удалит элементы, которые добавляются к телу документа и которые нельзя явно связать с виджетом, просто взглянув на DOM. Так, например, элемент с классом k-animation-container убран для выпадающих списков. В комментарии к документации говорится, что элементы на месте не удаляются.

Для того, чтобы удалить все, вы должны вызвать уничтожение виджета, а затем самостоятельно удалить оставшиеся элементы. Самый простой вариант — создать обертку вокруг всех виджетов, которые вы хотите уничтожить, и удалить их. Если вы хотите удалить конкретный виджет, обычно вы также можете сослаться на свойство wrapper, которое содержит элемент jQuery, представляющий самый внешний элемент DOM этого виджета:

$(widget.wrapper).remove();

поэтому в вашем случае это удалит все элементы и события для раскрывающегося списка:

var dropdownlist = $("#dropdownlist").data("kendoDropDownList");
dropdownlist.destroy();
dropdownlist.wrapper.remove();

Если вы хотите удалить все, что вы создали для окна кендо, вы можете сделать то же самое:

var window = $("#window").data("kendoWindow");
// recursively call destroy for all widgets it finds
kendo.destroy(window.wrapper); 
window.wrapper.remove();

По какой-то причине ни одно из предыдущих решений не сработало для меня, и это то, что я в итоге реализовал.

var grid = $('#GridName').data("kendoGrid");

//get grid data
var gridData = grid.dataSource.data();

//set the length (cannot use data.length in for loop as it changes when you remove the data items)
var dataLength = gridData.length;

//remove data from the grid
if (dataLength > 0) {
    for (var i = 0; i < dataLength; i++) {
        //must delete the first object in the array else it throws index out of bounds 
        //error because the data array changes when you remove an object
        grid.dataSource.remove(data[0]);
    }
}