Question

I am working with JQuery dialog which is opened before an ajax call and on returning from the ajax call the dialog(‘close’) is executed. below statement opens up the busy dialog box as a banner (with no ok or cancel option):

$('.updateActionsTasks').live('click', function ()
{$('#modalBusy').html('<span>Busy...Please Wait.</span>').dialog({ dialogClass: 'no-close', resizable: false, width: 100, height: 100, modal: true, title: 'Busy' });  
More code goes here ...
//Ajax function call goes here

However, the close method work correctly only once. Upon executing the click again, the dialog opens up but never gets closed. The line with tag ‘COMM’ executes but does not close the dialog from second time execution on wards.

function ActionWorklistItem(serviceUrl, worklistActionItems, actionName, ActiveTab) {
$.ajax({
    type: "GET",
    url: serviceUrl,
    dataType: ($.browser.msie) ? "text" : "xml",
    success: function (data) {
        var xml;
        if (typeof data == "string") {
            xml = new ActiveXObject("Microsoft.XMLDOM");
            xml.async = false;
            xml.loadXML(data);
        } else {
            xml = data;
        }
        var xmlText = $(xml).text();
        xmlObj = $.parseXML(xmlText);
        if ($(xmlObj).find('IsSuccess').text() == 'true') {
            $('#modalBusy').dialog('close'); //COMM: This always executes
            __doPostBack($('.upWorklistCtrlID').val(), ActiveTab);
        } else {
            $('#modalBusy').dialog('close');
            //Create error msg dialog           }
    },
    error: function (xhr, ajaxOptions, thrownError) {
        $('#modalBusy').dialog('close');
        //Create error msg dialog
    }
});

Answer 1

Following line seems to have done the trick.

$('#modalBusy').dialog('destroy').remove();