We help IT Professionals succeed at work.
Get Started

Select list doesn't render or freezes when using onchange in IE10

1,319 Views
Last Modified: 2013-08-31
I've got the following HTML in an IE10 browser (below)

When clicking in the upper left <select> to trigger its "onchange", I expect the upper right select list to change its second row of text, using JavaScript.

However, this does not work OK.  
With my first click, the onchange function executes correctly, but the upper right select does not re-render at all. Nothing happens.
Succeeding clicks does change the upper right select list, but the rendering seems to be "one click behind". Subsequently moving the mouse over the second select field seems to trigger its rendering.

The lower <select> is even worse. Its onchange function is supposed to change the content of a row in the very same select list, itself.
When clicking to trigger the event, the select list "freezes" and becomes completely unresponsive, until I've moved focus to any other field (i.e. the upper select lists) and starts all over again.

In IE9 (and other browsers like Chrome, Firefox, IE8 etc) all works OK, just as expected.
But IE10 executes really annoyingly!

Any ideas?
Right now I'm testing with IE10 version 10.0.9200.16576
Does anybody get the above behaviour with other IE10 versions?

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN" "http://www.w3.org/TR/html4/frameset.dtd">
<html>
<head>
<script>
function SetList(field) {
  var now = new Date();
  field.options[1].text = 'set '+now.getTime();
}
</script>
</head>
<body>
<form name=TheForm>
Test 1 (set next field):
<select size=3 onChange="SetList(document.TheForm.Test1)">
  <option selected>First row
  <option>Click to set value in list to the right
  <option>Third row
</select>
<select size=3 name=Test1>
  <option selected>Choice 1
  <option>Choice 2
  <option>Choice 3
</select>
<br><br>
Test 2 (set itself):
<select name=Test2 size=3 onChange="SetList(document.TheForm.Test2)">
  <option selected>First row
  <option>Click to set value in same list
  <option>Third row
</select>
</body>
</html>

Open in new window

Comment
Watch Question
This problem has been solved!
Unlock 2 Answers and 7 Comments.
See Answers
Why Experts Exchange?

Experts Exchange always has the answer, or at the least points me in the correct direction! It is like having another employee that is extremely experienced.

Jim Murphy
Programmer at Smart IT Solutions

When asked, what has been your best career decision?

Deciding to stick with EE.

Mohamed Asif
Technical Department Head

Being involved with EE helped me to grow personally and professionally.

Carl Webster
CTP, Sr Infrastructure Consultant
Ask ANY Question

Connect with Certified Experts to gain insight and support on specific technology challenges including:

  • Troubleshooting
  • Research
  • Professional Opinions
Did You Know?

We've partnered with two important charities to provide clean water and computer science education to those who need it most. READ MORE