Search jQuery

jQuery Forum

Developing jQuery UI

devidian

Add Dialog option containment

in Developing jQuery UI • 8 years ago

Hi,

i changed in my 1.8.21 following to solve different problems:

In _makeResizable:function(c){ and _makeDraggable:function(){ i changed the line containment: "document", to containment: c.containment, // containment: e.containment,

Then i added containment: "document", to the Dialog options.

Now nothing changed in normal use of Dialog, but you can change containment to "window" e.g. to make the dialog moveable over the whole page (not only the "uscrolled" top of the page"). So there wont be any snap back to top.

Or you can combine "window" with CSS position: fixed, to have the dialog fixed on screen but moveable.

Or just add the window to a special container.

I would like to see that change in the next release !

Devidian

Replies(1)

Kevin B

Re: Add Dialog option containment

8 years ago

I like the way it is currently setup. You have to access the widget itself through .data(), and then modify the instance of draggable or resizable directly.

$("#dialog").dialog().data("dialog").uiDialog.draggable("option","containment","#parent");

http://jsfiddle.net/aXWAj/

If you start combining all of the options from resizable and draggable directly into dialog, there would be some overlap in the events area and the number of options for the dialog widget will become very large.

-- Kevin

diaus.gr

Re: Add Dialog option containment

8 years ago

I also like the way it is currently setup BUT consider next: every time I change 'draggable' option I need also to set all my custom options (specifically 'containment' in this case), it's not an issue until the code that changes 'draggable' option is external for code that wants to set custom options for 'draggable' (i.e. some sort of library or extension that manipulates Dialog controls). Anyway I should remember that every time changing 'draggable' for Dialog I also should set custom options and that makes code more error prone.

The solution I used when implementing "some sort of library" (yes, it's absolutely not fantastic situation I described) is to override _makeDraggable function in next way:

(function($){
  var dialogExtensions ={
    _makeDraggable_original: $.ui.dialog.prototype._makeDraggable,
    _makeDraggable: function () {
      // original code
      this._makeDraggable_original();
      // set containment from options
      if (this.options.containment) {
        this.uiDialog.draggable("option", "containment", this.options.containment);
      }
    }
  };
  $.extend($.ui.dialog.prototype, dialogExtensions);
})(jQuery);

I'm absolutely agree that changing default dialog draggable options for every user request is not the case, but returning to my earlier "BUT": it would be more convenient if I could define user-defined default draggable/resizable options when creating dialog instead of custom overriding _makeDraggable/_makeResizable functions of dialog control.

I will be very pleased if it will be taken into account in one of next releases of jquery-ui

Top Reply

Response title

Attachments

jQuery Forum

Add Dialog option containment

Replies(1)

Re: Add Dialog option containment

Re: Add Dialog option containment

Statistics

Tags

Actions