닫을 때 대화 상자를 완전히 제거하는 방법

아약스 작업이 실패하면 오류가있는 새 div를 만든 다음 대화 상자로 표시합니다. 대화 상자가 닫히면 div를 완전히 파괴하고 다시 제거하고 싶습니다. 어떻게해야합니까? 내 코드는 현재 다음과 같습니다.

$('<div>We failed</div>')
    .dialog(
    {
        title: 'Error',
        close: function(event, ui)
        {
            $(this).destroy().remove();
        }
    });

이 대화 상자를 실행하면 대화 상자가 올바르게 표시되지만 대화 상자를 닫으면 대화 상자가 여전히 HTML에 표시됩니다 (FireBug 사용). 내가 여기서 무엇을 놓치고 있습니까? 내가 잊어 버린 것?

업데이트 : 방금 코드에서 Firebug 콘솔에 오류가 있음을 알았습니다.

$ (this) .destroy는 함수가 아닙니다

누구든지 나를 도울 수 있습니까?

업데이트 : 방금 $(this).remove()대신하면 html에서 항목이 제거됩니다. 그러나 DOM에서 완전히 제거됩니까? 아니면 어떻게 든 파괴 기능을 먼저 호출해야합니까?

$(this).dialog('destroy').remove()

이것은 대화 상자를 파괴 한 다음 DOM에서 대화 상자를 "호스팅"했던 div를 제거합니다.

왜 제거 하시겠습니까?

여러 인스턴스가 생성되는 것을 방지하려면 다음 방법을 사용하십시오.

$('#myDialog') 
    .dialog( 
    { 
        title: 'Error', 
        close: function(event, ui) 
        { 
            $(this).dialog('close');
        } 
    }); 

그리고 오류가 발생하면 다음을 수행하십시오.

$('#myDialog').html("Ooops.");
$('#myDialog').dialog('open');

$(dialogElement).empty();

$(dialogElement).remove();

이것은 진짜로 수정

이것은 나를 위해 일했다

$('<div>We failed</div>')
    .dialog(
    {
        title: 'Error',
        close: function(event, ui)
        {
            $(this).dialog("close");
            $(this).remove();
        }
    });

건배!

추신 : 나는 다소 비슷한 문제가 있었고 위의 접근 방식으로 해결했습니다.

나를 위해 매력처럼 작동하는 못생긴 솔루션 :

$("#mydialog").dialog(
    open: function(){
        $('div.ui-widget-overlay').hide();
        $("div.ui-dialog").not(':first').remove();
}
});

당신은 사용할 수 있습니다

$(dialogElement).empty();    
$(dialogElement).remove();

모든 js 프로젝트에서이 기능을 사용합니다.

당신은 그것을 호출 : hideAndResetModals ( "# IdModalDialog")

다음을 정의합니다.

function hideAndResetModals(modalID)
{
    $(modalID).modal('hide');
    clearValidation(modalID); //You implement it if you need it. If not, you can remote this line
    $(modalID).on('hidden.bs.modal', function () 
    {
        $(modalID).find('form').trigger('reset');  
    });
}