Рекурсивно уничтожить содержимое jQuery UI Dialog

Question

Мой код открывает диалоговое окно пользовательского интерфейса jQuery и использует AJAX для загрузки содержимого. В диалоговом окне инициализируется несколько других виджетов. Когда диалог закрыт, я уничтожаю() и удаляю() его div, но он не уничтожает виджеты внутри.

Как правильно удалить все элементы внутри mydiv в диалоговом окне закрытия?

// mydiv contains variable content 
mydiv.dialog({ 

    autoOpen: true, 
    close: function(){ 
     // destroy mydiv and all widgets inside it 

     mydiv.dialog('destroy').remove(); 

     alert('Unfortunatelly, inner dialog remained. How to get rid of ALL widgets placed inside "mydiv?"'); 
     // How do i destroy everything inside? 
    }   
}); 

Интерактивный образец: http://jsfiddle.net/r4cHY/4/

Спасибо!

Answer 1

Я решил свою проблему. Реализация диалогового окна jQuery UI удаляет назначенное полностью из родителя и перемещает его внутри, где его можно позиционировать лучше. К сожалению, больше нет связи между контекстом диалога, в котором он был открыт, и виджет, поэтому уничтожение контента не может повлиять на диалог.

Лучше скрипка: http://jsfiddle.net/gxXBY/

Это приводит к разному роду отрицательных эффектов внутри сложной системы пользовательского интерфейса, и я считаю, это ошибка в JQuery UI. Вот исправление:

var oldcr = $.ui.dialog.prototype._create; 
$.ui.dialog.prototype._create = function(){ 
    var self=this; 
    $('<div/>').insertBefore(this.element).on('remove',function(){ 
     self.element.remove(); 
    }); 
    oldcr.apply(this,arguments); 
}; 

Добавить это в свой javascript в любом месте, и он исправит все диалоги. Отлично работал для меня.