Forum: Rails Spinoffs (closed, excessive spam) iFrames - prototype.js

Posted by Oscar Hiboux (Guest)
on 2008-03-21 03:17
(Received via mailing list)
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!
Posted by David Lam (Guest)
on 2008-03-21 05:55
(Received via mailing list)
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>
Posted by kangax (Guest)
on 2008-03-21 07:32
(Received via mailing list)
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.
...
This topic is locked and can not be replied to.