Hi
I'm trying to dynamically add content to a select box when it is
clicked (because the app that I am developing contains many, many
select boxes with huge lists that are just way too slow to populate on
page load).
I have written code that works fine in gecko based browsers but in
Internet Explorer 6 after the select is populated, it is resized and
the popup is closed before the user can select an option. I have tried
returning false from onmousedown/onmouseup/onclick if the select is not
yet populated, I have tried setting a timeout to call the Click()
method (or the onclick/onmouseup/onmousedown method) if it isn't
populated but I can't seem to stop the popup list disappearing in IE6.
Any ideas appreciated.
(Stripped-down example code follows)
<!DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dt d">
<html>
<head>
<title>Select Bug TestBed</title>
<script>
function LazyPopulate(el em)
{
if(elem.populat ed == null)
{
//Copy the list items across
for(var j = 1 ; j < 10 ; j++)
{
elem.options[j]=new Option("new"+j, "value"+j);
}
elem.populated= true;
}
}
</script>
</head>
<body>
<select id="sel" onclick="LazyPo pulate(this);">
<option>first </option>
</select>
</body>
</html>
