CODEWITHSUNDEEP
javascriptjqueryjquery-ui-dialog
activebiz
activebiz

Reputation: 6228

jquery dialog close not working "cannot call methods on dialog prior to initialization; attempted to call method"

I am getting following error on my jquery dialog box close. jquery 1.9.1 jquery-ui-1.10.3

Error: cannot call methods on dialog prior to initialization; attempted to call method 'close'

// Check if a given callback is in the list.

    var popupDialog = $("<div id='popupDialogBox'></div>");
function Popup(url, width, height) {
    if (width == undefined)
        width = 400;
    if (height == undefined)
        height = 300;
    //var buttonArray = {};
    //buttonArray["Close"] = function () {
    //    $(popupDialog).dialog("close");
    //};
    popupDialog.dialog({
        closeOnEscape: false,
        modal: true,
        autoOpen: false,
        resizable: false,
        buttons: [{
            text: "Cancel",
            click: function () {
                $(popupDialog).dialog("close");
            }
        }]
        //buttons: buttonArray,
        //buttons: {
        //    "OK": function () {
        //        //debugger;
        //        //alert('test');
        //        //$(popupDialog).parent().remove();
        //        $(this).dialog("close");
        //        return false;
        //    }
        //}
        //buttons: [{
        //    text: "close",
        //    "class": "button",
        //    close: function () {
        //        $(popupDialog).dialog('close');
        //        //alert('test');
        //    }
        //}]
    });
    popupDialog.load(url + '?popup=1');
    popupDialog.dialog("option", "width", width);
    popupDialog.dialog("option", "height", height);
    popupDialog.dialog('open');
    return false;
}

If I put alert before $(popupDialog).dialog('close') then the alert works but the dialog still gives the same error

Not sure what am I doing wrong here but nothing seems to work.

Any idea?

Upvotes: 0

Views: 826

Answers (1)

JohnKochJR
JohnKochJR

Reputation: 133

You have to add the div to the DOM first.

Change var popupDialog = $("<div id='popupDialogBox'></div>");" to be this: $("html").append("<div id='popupDialogBox' />"); var popupDialog = $("#popupDialogBox");

Then continue with your code.

Upvotes: 1

Related Questions