Sw4 > Web > IE JavaScript Gotchas
Internet Explorer JavaScript Gotchas
MicroSoft in their infinite wisdom decided to create their own version of JavaScript called, JScript. Internet Explorer (IE) is therefore not a fully W3C compliant browser.
This makes the programmer's job harder, having to create JavaScript workarounds for IE. This section covers any IE JavaScript gotchas which I have run into.
To detect IE in an if statement:
if (document.all)
{
alert("IE Browser");
}
else
{
alert("non-IE Browser");
}
availHeight/Width
The availHeight/Width attributes are not available with IE.
Depending on the version of IE there are different techniques you must use to find the available height and width.
Here's the IE workaround which I eventually found.
var Height
if (window.innerHeight)
{
Height = window.innerHeight;
}
else if (document.documentElement && document.documentElement.clientHeight)
{
Height = document.documentElement.clientHeight;
}
else if (document.body)
{
Height = document.body.clientHeight;
}
return Height;
}
createElement - input
Creating an input element (button, checkbox, ...) is easy in W3C compliant browsers. You create the element, set the type, and add the element. Not so easy with IE. IE won't let you set the type attribute after you create it.
I lost an entire morning trying to find a cross-browser solution to this gotcha. It appears the only way is to create the input element using HTML text which you add to the right location in your page. I ran out of time and never did get it solved.onload
If you create a JavaScript function called onload it will automatically be called when the page has finished loading, except IE.
The IE workaround is add onload to the html body tag and have it call the onload function.
<body onload="onload();" >
The downside to this workaround is that your page must always have an onload() function or a JavaScript error will be generated each time the page is loaded.
Think of onload as the $construct method in Omnis Studio.
If you have an onload() function in your HTML page and an onload() function in a referenced JavaScript file, only one of the onload() functions will be called. If your HTML page references several JavaScript files you have to be careful that each function name is unique.
One strategy is to have an init...() function in each JavaScript file which needs to be run when the page is loaded. (e.g. initSearchBar, initNavList, ...) The onload() function in your HTML page would then call each of the JavaScript file init...() functions as required for that page.
type
W3C compliant browsers let you change the type attribute of an input element.
ElemRef.type = "checkbox"
Not so easy with IE. IE gives you an error if you try to set the type property.
I lost an entire morning trying to find a cross-browser solution to this gotcha. The only way I could find was to replace the input element with a new input element. Adding a new input element is a headache in IE. See createElement - input for more info.window.open
The second parameter, WindowName, can not include any spaces or you will generate an error.
WinRef = window.open('URL_opt','WindowName','AttributesCSV');