James Lin
James Lin

Reputation: 26538

How to extend JQuery UI plugin

The existing dialog plugin doesn't have an option to close dialog on clicking modal overlay, how to add an option to provide the functionality?

Upvotes: 1

Views: 389

Answers (2)

Sam Tyson
Sam Tyson

Reputation: 4626

It would be even better if the self-provided answer worked.

I get no response when clicking outside the dialog. Here is my jsFiddle for testing.

Maybe I am doing something wrong, but it doesn't seem to do its desired function.

@JamesLin provided the key insight. I needed to add the new option in my initialization:

$("#myDialog").dialog({
    overlay_close:true,
    modal: true
});

The jsFiddle is also updated.

Upvotes: 0

James Lin
James Lin

Reputation: 26538

(function($){
   var _init = $.ui.dialog.prototype._init;
   $.ui.dialog.prototype._init = function(){
        var self = this;
        _init.apply(this,arguments);
        $('.ui-widget-overlay').live('click', function(){
            if (self.options['overlay_close']){
                self.destroy();
            }
        });
    }
})($);

Upvotes: 1

Related Questions