Hi!
I'm programming a little WYSIWYG editor and I'm having problem to
use prototype.js functionalities in my iFrame (using designMode =
"on"). Prototype.js seems to extend the elements of the top window
only but not those inside the iFrame. Moreover I tried to include
prototype.js in my iFrame dynamically, appending a "script" element in
its "head" element, but it does not work: it is not evaluated (I put a
spy "console.log" instruction at prototype.js beginning and it does
not produce anything). To be sure of my instructions, I tried then to
add it dynamically in the top window and it is evaluated another time,
as expected.
So, what's wrong with the iFrame elements and their own elements?
If I do $(element), where "element" is an element of the iFrame, it
does not have the prototype.js properties like "down" method for
example. What am I supposed to do in order to enjoy prototype.js with
my iFrame?
Thanks a lot!
on 2008-03-21 03:17
on 2008-03-21 05:55
errr, just put in the prototype <script> tag in the head element and i think it should work... never tried with document.write or whatever you mean by "dynamically" and stuff On Thu, Mar 20, 2008 at 7:16 PM, Oscar Hiboux <pierre.voisin@gmail.com>
on 2008-03-21 07:32
Here's a quick solution. I have only tested it in FF - the snippet
makes sure all of iframe's elements are extended with methods and
those methods work as expected.
Prototype.extendFrame = function(element) {
element = $(element);
for (var m in Element.Methods) {
if (Object.isFunction(Element.Methods[m])) {
element.contentWindow.Element.prototype[m] =
Element.Methods[m].methodize();
}
}
}
...
$(document.body).insert('<iframe id="test">');
Prototype.extendFrame('test');
...
$('test').contentDocument.body.insert('div'); // => <div>
// etc.
...