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

Question

For some reason, everything was working perfectly. Then suddenly it started showing this error: Uncaught cannot call methods on dialog prior to initialization; attempted to call method 'close' . Here is my code:

function loginshow() {
    hidepost();
    must_login();
    //$("#login_button").delay(200).show("fade",500);
    //$("#logmein").unbind("click");
    //$("#logmein").bind("click",loginhide);

}

function loginhide() {
    console.log("hi");
    $("#login_button").hide("fade", 100);
    $("#login_box").show(001);
    $("#reg_button").hide(001);
    $("#login_button").css("height", "75px");
    $("#logmein").unbind("click");
    $("#logmein").bind("click", loginshow);
    $("#dialog-message").dialog("close");
}

function must_login() {

    $("#dialog-message").dialog({
        width: '400',
        draggable: false,
        resizable: false

    });
}

function hide_must_login() {
    $("#dialog-message").dialog('close');
}

I am using jquery 1.6.0 and jquery ui 1.9.0 if that helps. I cant update to anything above 1.7.0 because I need the .live() function.

You can see it live here.

Click Check in at the top and try to close that dialog.

Please help

Answer 1

You are binding click event on multiple close buttons since you have many close buttons having class close. Same is the case with dialogs having dialog-close class.

Provide a particular id to each dialog and its close button..

And then Use this code...

$("#checkInDialogCloseButton").live("click",function(){ $("#checkInDialog").dialog("close");});