RE: IE 7 Appears to Hang after JScript runs (code works in IE 5.5 & IE

Tech-Archive recommends: Repair Windows Errors & Optimize Windows Performance

Because I realized my example/issue is complex, I'm going to create a simple
page that shows the issue. The current application pages are database driven,
and all the JavaScript is in .js files. It's too much code for anybody to
parse through for free (except maybe MS, after they see it fail in a simple
context.)

I'll create a page with minimum code showing the issue and post it to a
public URL so others can see all the code with view source. Maybe someone
will spot the issue where I'm blind.

I'll post here when the page is live, probably later today. Maybe I'll
figure out the issue in the process,(read: trip over a solution) and if that
happens, I'll post the solution here so others can see what I found.





"Don Silver" wrote:

I'm hoping I'm missing something simple and fresh eyes will point out an
obvious issue I'm missing.

Exec summary:
Code that has worked for over 4 years in IE 5.5 and IE 6 causes IE7 to
ignore all input (mouse clicks), until you lose focus on the IE7 window OR
you press the tab key. Users think the page is frozen. Code samples below. I
can provide a link to a working version of the page via private mail but I
can't post it publicly. (It's a complex application.)

DETAILS:
Around 4 years ago we needed a "Editable Dropdown" HTML control for IE 5.5.
HTML doesn't have that control, so we added some JavaScript that makes a
hidden DIV visible when a user clicks on a down arrow button next to a text
box. The div contains a list, user selects something and the onMouseUp event
fires. We take the selection in the list, and move it to the Input box
(text), simulating the behaviors of a native window control. The values in
the list are from a database, and everything is build dynamically.

It has worked for over 4 years in IE 5.5 and all versions of IE 6. In IE7
the browser is unresponsive until the user presses Tab, clicks outside the
IE7 window or otherwise moves focus off, then back to IE7. Then it works as
expected.
We have tried lots of variations of this code, without finding a any
solution. Maybe it will be obvious to the experts here.

Here is the HTML from view source:


<input type='text' style='width: 175px;' value='Committee Meeting'
name='txtDdn_1' id='txtDdn_1' onchange='clearDdn(1);'
onKeyUp='checkReservationType()' maxLength='50' tabIndex='4' ><img
src='/images/buttons/downArrow.gif' onclick='showDdn(1);' align='absmiddle'
name='imgDdn_1'>
<div id='divDdnContent_1'
style='visibility:hidden;z-index:999;width:195;position:absolute;'>
<select id='ddnOptions_1' tabindex='-201' name='ddnOptions_1'
onchange='moveInfo(1);' size='5' style='width:195px;' >
<option value='1'>Client Meeting</option>
<option value='5'>Closing</option>
<option value='4'>Committee Meeting</option>
<option value='2'>Deposition</option>
<option value='9'>Other</option>
</select></div>

JavaScript Functions:

function showDdn(iIndex) {
var oDivDdn = document.getElementById("divDdnContent_" + iIndex);
var oDdnOptions = document.getElementById("ddnOptions_" + iIndex);
var iXOffset = oDivDdn.style.width;
iXOffset = iXOffset.slice(0,iXOffset.length - 2);

oDivDdn.style.top = getDdnY("imgDdn_" + iIndex) + 20;
oDivDdn.style.left = getDdnX("imgDdn_" + iIndex) - iXOffset + 20;
oDivDdn.style.visibility = "visible";
oDdnOptions.focus();

document.attachEvent("onmouseup",hideDdn);
}

function moveInfo(iDdnIndex) {
var oTextField = document.getElementById("txtDdn_" + iDdnIndex);
var oSelectBox = document.getElementById("ddnOptions_" + iDdnIndex);
if(oSelectBox[oSelectBox.selectedIndex].value!='NoRecs'){
oTextField.value = oSelectBox[oSelectBox.selectedIndex].text;
}
}

function clearDdn(iIndex) {
var oSelectBox = document.getElementById("ddnOptions_" + iIndex);
oSelectBox.selectedIndex = -1;
}

function hideDdn() {
// In order for this to work, any editable drop-down fields must be
contained in a div called
// divContent.
var oDivContainer = document.body;
var oDivCurrentDdn;
var sID;

//alert(document.body.all[0].getAttribute("id"));
for(var iCtr in oDivContainer.all) {
// This section finds any visible ddn objects on the page and hides them.
if(iCtr.indexOf("divDdnContent_") > -1) {
oDivCurrentDdn = document.getElementById(iCtr);
oDivCurrentDdn.style.visibility = "hidden";
}
}
document.detachEvent("onmouseup",hideDdn);
}

.

Relevant Pages

  • IE 7 Appears to Hang after JScript runs (code works in IE 5.5 & IE
    ... obvious issue I'm missing. ... The div contains a list, user selects something and the onMouseUp event ... IE7 window or otherwise moves focus off, ... var iXOffset = oDivDdn.style.width; ...
    (microsoft.public.scripting.jscript)
  • Re: Script for Hiding/Un-Hiding Text On Click
    ... JavaScript is disabled, then everything should appear), but this has ... the question and a div for the answer.) ... var a = p.getElementsByTagName; ...
    (comp.lang.javascript)
  • Re: Cant refer to innerHTML contents
    ... that I can't refer to any new element or text within that DIV. ... using a simple AJAX call to load a page that has some JavaScript, ... var el = document.getElementById; ... Javascript Best Practices - http://www.JavascriptToolbox.com/bestpractices/ ...
    (comp.lang.javascript)
  • Re: accessing runat=server div in javascript
    ... var o = parent.document.getElementById ... Within this page I have an inline frame that contains another page ... It is just a page full of javascript. ... of the div on the ASP page quite easily using the javascript... ...
    (microsoft.public.dotnet.framework.aspnet)
  • Regular expression
    ... I obtained all the html code contained in a div by: ... var all = getElementsByClassName; ... Using the function replace (javascript) I'd like to remove all the code inside and following the ...
    (comp.lang.javascript)