IE7, creating widgets on parent document

[ronchalant]

I maintain a legacy web application and at times we find it necessary to use iframes rather than injecting directly into the existing DOM (for reasons I don't want to delve into here, just know that it's unfortunately necessary).

At times, I actually have injected elements into the DOM of the parent document from within the iframe, using following a hack pattern like this:

this._document = this.element.get(0).ownerDocument || document;
this._win = this._document.defaultView || this._document .parentWindow || window; 
...
$('<div></div>', this._document).appendTo($someElemOnParent)....;

This wasn't necessary for most browsers, but IE7 at least seemed to require it.

Unfortunately I found that if some of my injected DOM elements tried to use jQuery UI widgets (e.g. buttons) it would fail for IE7. (I've been too frightened and not drunk enough to try it in IE6)

I'm not sure if calling widgets on DOM elements in parent documents is even supported, but I do find myself in a position where I'm testing if IE7 or less is the browser to just use the iframe as the document context.

[Scott González]

Duplicate of #4908.

[ronchalant]

I'm not sure it's the same issue. I'm not using event binding or selectors; it's failing when attempting to call .button() on a DOM element created with a fragment in a parent window.

The failure is when the jQuery UI widgets themselves are used on elements created (with proper document context) in a parent window from an iframe.

Because of the iframe nature, it's not something I can code up on jsfiddle, but here's something that will fail if called from within an iframe to a parent window (note that the parent window does need to at least have jquery ui styles):

var pdoc = parent.document; // parent document
var $pbody = $(pdoc).find('body'); // body from parent doc

$('<button></button>', pdoc)
    .appendTo($pbody) // appends okay in IE7
    .button() // << fails here
    ;

If it's not supported that's fine; I have modified the button widget for my project to take into account which document this.element is on and pass it into the "<span></span>" creation block. This solves my issue since it's (currently) the only widget I'm leveraging in the parent window.

[ronchalant]

The change that addresses my issue is on my fork: ​https://github.com/ronchalant/jquery-ui/commit/61e93547e6ed9ac6543f1ae382387b453980bc11#ui/jquery.ui.button.js

[Scott González]

It's the same issue; that ticket is for anything related to cross-window issues. I'll land the your button specific fix right now.