Extension:ManagedIframe (Legacy)
This version of our Learning Center is unmaintained.
This article may be out-of-date or contain incorrect information.
Please visit the new Sencha Learning Center for up-to-date material.
From Sencha - Learn
| Summary: Iframe Panels |
| Author: Doug Hendricks |
| Published: 10/29/2007 |
| Version: 2.1.2 |
| Ext Version: 1.1+(MIF only), 2.0.x, 3.1.1+only(GPL) |
| License: GPLv3 |
| Demo Link: No Demo |
| Forum Post: View Post |
Contents |
Introduction
- Ever try to use an Iframe element as a writable body to Ext.Panel? Perhaps to render your own content in isolation from the rest of the host page, or just load another website in a tab panel.
- Getting an IFRAME into the right place in the DOM isn't too difficult, but updating its contents with Ext.Elements' update method is a challenge. Ext.Element assumes the element it's managing has a innerHTML property. Well, IFRAMEs don't! So to make writable IFRAMEs easier to use within Ext framework, this extension overrides the default update method of Ext.Element(for the designated IFRAME) to provide exactly that sort of thing. Now, you can use:
IFrameEl.update("<div>New content</div>")
meaning -- you can write any string content (replacing the entire document) directly to embedded document model of an IFrame. When using the extensions' new update and existing load methods, your IFrame acts like any other updateable (like innerHTML) element.
Download
See attachments on this forum post.
Component Reference
- Using ManagedIFrame
- ManagedIFrame Properties and Methods
- Loading your ManagedIFrame
- ManagedIFrame and Same-domain Frame access
- UpdateManager and ManagedIFrame
- Scripting your ManagedIFrame
- Ext.Element, CSS Selector Queries, and Event Management (1.1+)
- Cross-frame messaging with ManagedIFrame
- ManagedIFramePanel and Layouts
- FAQ
IFRAME and XHTML Doctypes
XHTML 1.0 Strict: IFRAME is not part of XHTML 1.0 Strict DTD specification, so on pages that require validation with IFRAME in the document markup, use the XHTML 1.0 Transitional doctype instead:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
(Advice: Refrain from reducing core functionality simply to satisfy a validator - it makes absolutely no difference to the browser which XHTML version you choose. In this case, if you need an IFRAME, consider a transitional DTD if you want it to validate. Issues surrounding IFRAMEs in the presence of strict XHMTL can be avoided altogether by allowing the ManagedIFrame instance to manage element creation as necessary.)
For valid pages where you are compelled to use an iframe tag in markup, you can use this XHTML DTD:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd">