Dialog: Allow dialog to be attached to a element other than body.

[lukoff]

When dialogs are created they are moved to the end of the body. When using YUI reset-fonts-grids (and possibly other frameworks), dialog should be placed under #bd to look properly. I use following workaround:

$("#dialog").parent().appendTo($("#bd"));

I think it should be implemented via "parent" option so that one can pass an element under which dialog will be moved when created.

[Jörn Zaefferer]

scott.gonzalez, we explicitly decided not to add an appendTo option. What about this usecase?

[Jörn Zaefferer]

From irc: "Why did we decide not to add appendTo?" - we didn't need it for the ui-front stacking implementation, as everything should go on the body and "stack" there.

Here the usecase is about inheriting styles from a non-body parent element.

[Jörn Zaefferer]

Is this usecase enough to justify an appendTo option? It probably also applies to Themeroller's scope option, where you also need a parent element that's a descendant from body.

[mikesherov]

I think it's fine to leave this open a bit longer and see if anyone else has a different use case for it. But my gut says that adding this option doesn't seem to make sense when the workaround is so simple compared to the frequency of this use case.

[jajo]

Another use case where this would be helpful is when using dialog with the Full Screen API.

At the moment if you have an element other than body in full screen the dialog does not appear when added. I tried to create a jsFiddle (​http://jsfiddle.net/8SSY9/1/) to show this but because the site uses iframes you cannot use the Full Screen APIand I do not have a server I could place it on.

To fix this you could check for the fullscreenElement when creating a dialog but as this is a very experimental feature of browsers I think it would probably be worth waiting until it is better supported and standardised. So I think the best way to address it would be to add the appendTo option and then people using the full screen API would be able to decide where to place dialogs when they create them, which is what I am currently doing.

[Jörn Zaefferer]

You can render the fiddle without a frame: ​http://jsfiddle.net/8SSY9/1/show/

I've modified your example to show that appending the dialog to the fullscreened element fixes it: ​http://jsfiddle.net/ALkxj/1/show/

That along with the scoping issues seems argument enough to me to add this option. It'll be consistent with other popup widgets, too.

[Scott González]

Dialog: Added appendTo option. Fixes #7948 - Dialog: Allow dialog to be attached to a element other than body.

Changeset: 70b16ef445d8f9947fd414894d97673706ee8c6f