Categories
Firefox HTML Internet Explorer JavaScript

base html tag does not apply correctly to all javascript and style files

Problem: The

<base href="http://example.com/path/to/res/">

  did not work at all on Internet Explorer – no javascript or style files were loaded and worked partially in Mozilla Firefox – a few javascript files were not pointing to the path that should be transformed by base href attribute.

Example:

Array(
[0] => 1
)
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<base href="http://example.com/path/to/res/">
<link rel="stylesheet" href="./css/styles.css" type="text/css" />
<scrupt src="./js/jquery.js" type="text/javascript"></script>
<scrupt src="./js/j1.js" type="text/javascript"></script>
<scrupt src="./js/j2.js" type="text/javascript"></script>

This code produced a page with no style files and  no javascript files included in Interenet Explorer 8 and a few javascript files (j1.js and j2.js) were not included in Firefox 3.5 because base tag was not applied. After several tests and all kind of different arrangements we discovered that the problem was the output before the page source the

Array ...

thing.

Solution: no output before the page’s headers otherwise you can get all kind of strange results including a html base tag not working correctly.

Categories
Internet Explorer JavaScript

Object doesn’t support property or method. Adding options in a <select> from a child window on Internet Explorer

Full error message:  Object doesn’t support property or method. I got this error message in Internet Explorer 7 every time i tried to run code similar to the next snippet:

window.opener.form.select[select.length]  = new Option(text, value);

The problem is that on Internet Explorer due to some mysterious security restrictions you are not allowed to add new options in a select element that resides in the parent (opener) window. In order to do this you need a workaround.

The easiest workaround is to write a function in the parent window that adds elements in the select element. The function should look something like this:

function addOptionToSelect(formName, selectName, optionText, optionValue) {
var elem = document.forms[formName].elements[selectName];
elem.options[elem.length] = new Option(optionText, optionValue);
}

This function has to be written in the parent window’s javascript and it will be accessed from child window with some code like this:

window.opener.addOptionToSelect(formName, selectName, optionText, optioValue);

Conclusion: Internet Explorer sucks.