The IFRAMEHandler is a utility class that handles the CRM GRID - IFRAME padding issue gracefully.
It also handles the preloading of a progress image and title e.g. “Account Opportunities”
If the URL is missing then an Error image is displayed followed by an inline message.
Here is a simple instruction on how to implement the solution:
1. Paste the IFRAMEHandler class inside the entity onload event.
2. Instanciate the IFRAMEHandler passing it the IFRAME id e.g. “IFRAME_Test”
3. The second parameter is an optional title/name that describes what the iframe is about to load.
4. Call the load function with the relevant url, this could be any url e.g. crm addressable url , your own aspx page or an external website.
Here is the complete code sample
var IFRAME_Test;
var IFRAME_More;
function OnCrmPageLoad()
{
//Create a Handler for the first IFRAME ( IframeId , IframeTitle )
IFRAME_Test = new IFRAMEHandler("IFRAME_Test","Account Homepage");
//Load the specified URL, this can be an inernal crm url , your own aspx or an external website
IFRAME_Test.LOAD("/[Organization Name]/_root/homepage.aspx?etc=1");
/* - */
//Create a Handler for the second IFRAME( IframeId )
IFRAME_More = new IFRAMEHandler("IFRAME_More");
//Set the iframe title, The title is displayed under the loading image
IFRAME_More.TITLE = "More Information";
IFRAME_More.LOAD("[URL]");
}
/* Paste the handler inside the entity onload event. */
function IFRAMEHandler(sIframeId,sTitle)
{
var Instance = this;
if(isNullOrEmpty(sIframeId)) return null;
/* Public Interface */
Instance.TITLE = sTitle;
//Get the Iframe object
Instance.IFRAME = document.getElementById(sIframeId);
//Bind to the change event
Instance.IFRAME.onreadystatechange = OnIframeReady;
//Pre-Defined messages
Instance.STRINGS = {
IFRAME_FAILEDLOAD : "", // + Title
IFRAME_PAGELOADING : "Loading" // + Title
}
Instance.IMAGES = {
IFRAME_LOADING : "/_imgs/AdvFind/progress.gif", //Progress
IFRAME_ERROR : "/_imgs/ico/16_L_remove.gif" //Error
}
Instance.LOAD = function(sUrl)
{
/* Reference the iframe document body and inject preloading html */
var IFRAMEBody = getIframeBody();
IFRAMEBody.style.margin = "0px";
IFRAMEBody.scroll = "no";
IFRAMEBody.innerHTML = "<table height='100%' width='100%' style='cursor:wait;border:1px solid #6b92ce'><tr><td valign='middle' align='center'><img id='Image' alt='' src='" + Instance.IMAGES.IFRAME_LOADING + "'/><br><span id='Message'>" + Instance.STRINGS.IFRAME_PAGELOADING + " " + Instance.TITLE + "</span></td></tr></table>";
/* Set the iframe url or preset an inline error message */
if(!isNullOrEmpty(sUrl)) Instance.IFRAME.src = sUrl;
else
{
var IFRAMElements = getIframeDoc().all;
IFRAMElements.Image.src = IMAGES.IFRAME_ERROR;
IFRAMElements.Message.innerHTML = STRINGS.IFRAME_FAILEDLOAD + " " + Instance.TITLE;
}
}
/* Private functions */
window.attachEvent("onunload",dispose);
function dispose()
{
Instance.STRINGS=null;
Instance.IMAGES=null;
Instance.IFRAME=null;
Instance=null;
}
function getIframeBody()
{
return getIframeDoc().body;
}
function getIframeDoc()
{
return Instance.IFRAME.contentWindow.document;
}
function OnIframeReady()
{
if( Instance.IFRAME.readyState!='complete') return;
if(typeof(getIframeDoc())=="unknown") return;
var IFRAMEBody = getIframeBody();
if(!IFRAMEBody.document.all.crmGrid) return;
IFRAMEBody.scroll="no";
IFRAMEBody.style.padding="0px";
IFRAMEBody.childNodes[0].rows[0].cells[0].style.padding="0px";
}
function isNullOrEmpty( obj )
{
return obj == null obj == "undefined" obj == "";
}
}
/* Entry point */
OnCrmPageLoad();
4 comments:
Hi Adi I copied and pasted your code into my form but I receive all the same error :
Field: window
Event: onload
Error: object doesn't support this property or method
Hi mceccacci,
My code uses made up iframe names. You need to replace those iframe with the one/ones you have in your form.
Secondly I recommend you enable debugging and put the debugger keyword at the top of the OnCrmPageLoad function then see where the code breaks.
Adi
Oh, and it should be:
function isNullOrEmpty( obj )
{
return obj == null || obj == "undefined" || obj == "";
}
Hi,
I'm using your code snippet from above and it works great!
The only thing is that sometimes I get an error 'IFRAMEHandler' is undefined. He doesn't know that object type. Which is included in my javascript file.
I'm looking crazy for a solution but I cant find any! £Can you help me with this? Using IE9 but I also get the error in IE87 and 8.
Thx
Post a Comment