jQuery UI Close Dialog on Overlay Click

I have seen a lot of overly complex solutions for this simple problem and none of them have been valid solutions, here is a snippet that accomplishes it in an unambiguous manner.

$('#el').dialog({
open: function(e){
          var self = this;
          $('.ui-widget-overlay').bind('click', function(){
            $(self).dialog('close');
          });
        },
        
        close: function(){
          $('.ui-widget-overlay').unbind('click');
        }
});

Popular Posts

Help The Javascript Blog

If you would like to write for The Javascript Blog or submit a plugin or class please feel free to contact us.


Leave Your Response

* Name, Email, Comment are Required