[Dan Man]

As you may or may not know, adding the "disabled" attribute to an <option> tag in IE does not work. There is a work-around to this using JavaScript that applies a gray-ish style to the option and does not allow the option to be selected, although it can be highlighted.

I am using AJAX to call a PHP page that prints out multiple

HTML Code:

<select> <option disabled>

that are loaded into a div.

The issue is that the JavaScript work-around for IE doesn't work correctly UNLESS I first use an alert() call. That is, the options marked disabled will still be selectable and not gray, but placing the alert() in the code makes it work as intended.

Has anyone ever run across this issue or something similar to it? Why would a call to alert() be the reason that it works? Does alert() do something special in IE that would affect the javascript or html? Is it even the call to alert() or something else?

The code for the javascript work-around is below:

Code:

function disableOptions() {
              if (document.getElementsByTagName) {
		var s = document.getElementsByTagName("select");

		if (s.length > 0) {
			window.select_current = new Array();

			for (var i=0, select; select = s[i]; i++) {
				select.onfocus = function(){ window.select_current[this.id] = this.selectedIndex; }
				select.onchange = function(){ restore(this); }
				emulate(select);
			}
		}
	}
}

function restore(e) {
	if (e.options[e.selectedIndex].disabled) {
		e.selectedIndex = window.select_current[e.id];
	}
}

function emulate(e) {
	for (var i=0, option; option = e.options[i]; i++) {
		if (option.disabled) {
			option.style.color = "graytext";
		}
		else {
			option.style.color = "menutext";
		}
	}
}

The disableOptions function is being called after the php is loaded via AJAX. Placing alert("") as the first line of the disableOptions function fixes the issue.

Any comments and advice welcome.

Thanks

[Dan Man]

Update: I found no solution to this issue, so as a result, I took a different path of implementation so that disabled options are not required.

I instead displayed only the selectable options within a drop down menu, and dynamically changed the options through JavaScript depending on different conditions. This method accomplished what the disabled options would have.

Thanks to all for taking the time to read and think about this topic.