CODEWITHSUNDEEP
javascriptjqueryhtmljquery-ui
user1434177
user1434177

Reputation: 1977

Jqueryui dialog("close") ends current javascript thread

Hi I am having an issue with closing my jquery dialog. What I have is a comet connection that sends messages to my browser. What I would like to do is when I receive a message I want to do some stuff, close the dialog then do some more stuff. Unfortunately when I execute: $('#dialog').dialog("close"); It ends my current javascript code. Is there a way to avoid this? or do I need to make sure the close is run right at the end using a variable?

For example, here you can see that my text will not change when it is after: http://jsfiddle.net/hKhMC/

This is a simple demonstration my actual code does a lot of calculations afterwards so I was wondering if there was a solution that doesn't involve moving the text before the close.

Upvotes: 1

Views: 1713

Answers (2)

Nal
Nal

Reputation: 2771

You are recursively firing the dialog close event. In Chrome your jsfiddle example causes a Uncaught RangeError: Maximum call stack size exceeded. This is because the .dialog('close') method fires the dialogclose event after closing the dialog. This event is also fired when someone clicks the X button on the dialog toolbar or presses the ESC key.

However you are binding this event during the dialog initialization and then calling the same method that can trigger it again.

Upvotes: 5

user1434177
user1434177

Reputation: 1977

So I found the solution to my problem.

Below was the code used to create the JQueryUI dialog

$('#currentCallDialog').dialog({
    autoOpen : false,
    height : 350,
    width : 550,
    modal : true,
    buttons : {
        "Open" : function() {
            //.. Do something
        }
    },
    close : function() {
        $(this).dialog("close");
    }
});

the problem is in the close button i try to call dialog("close"); Once this was removed it all worked fine, please see below code for working example:

$('#currentCallDialog').dialog({
    autoOpen : false,
    height : 350,
    width : 550,
    modal : true,
    buttons : {
        "Open" : function() {
            //.. Do something
        }
    },
    close : function() {
        //.. Do something
    }
});

Upvotes: 1

Related Questions