View Full Version : Focus to Toolbar Button in IE v8 Fails

8 Nov 2010, 1:32 PM
I have a Toolbar with a ComboBox and a button. When the user selects a file from the combo, its data displays and the focus should move from the combo to the button. I do this with a call to the standard focus() function at the end of the callback function that handles the combo select. This works fine in all cases in FF and fails only in IE. In IE, the cursor clearly stays in the combo's field.

My logging shows that the focus() function is getting called as expected and that the button reference is valid. I also tried various options on the focus() arguments, and tried setting the tabIndex on both items to make the button lower. Same results.

I'm guessing that I'm not alone in this glitch. Any suggestions?

9 Nov 2010, 8:45 AM
The following code works fine in FF, but fails to move focus from the ComboBox to the button in IE only. In fact, the attempt to call blur() in the code below makes no difference.

// There are no errors in this code, the logging fn() logs the id without problem ...
var btnRef = Ext.getCmp('myTBarButtonID');
if (Ext.isIE){
var elCombo = Ext.getCmp('myTBarComboBoxID').getEl();
diaLog('To call blur() on the element id:'+elCombo.id);// any-browser logging fn().

Does this have something to do with the fact that only Internet Explorer supports focusin and focusout events?
Please note this thread:

If so, it would seem that the Ext.Component.focus() function will not work in IE. Is there a common work-around? Am I missing something here?

9 Nov 2010, 3:06 PM
Here's what fixed it:

setTimeout(function() {
}, 20);

As mentioned in the first post, I had fiddled with the 2nd argument to get the delay. But then I tried passing 2000 in that argument to make the delay visually obvious, and noticed that the delay on the straight "btnRef.focus(false, 2000)" call wasn't doing anything. So I tried the above. There is a timing issue as IE gets busy doing stuff. This handled it.