IE 9 and IE 10 cannot enter text into input text boxes from time to time

Question

There is a web page with an iframe inside. Sometimes, Input text box controls, inside the iframe, are locked/ freezed. Users cannot enter text into them. But the text box ca

Answer 1

None of the solutions worked for me in IE 11.

Solved it by adding this code inside iframe:

$("input").first().focus().blur();

Obviously, this won't work if you don't have control over your iframe.

Answer 2

I have managed to fix this bug by setting focus back to the main page. What I have done so far is: put an HTML input textbox, which is set invisible, in the main page. When the iframe closes, I set focus back to that textbox.

Please refer following links for more information about this IE bug.

link1

link2

Answer 3

Here's the solution that worked for me, having tried all of the others on this page! Requires jQuery but I'm sure it could be rewritten in native JavaScript if that's necessary.

As with many of the other solutions, this should be added to the source of the iframe, assuming you have access to modify it:

$("body").focusout( function () { window.focus(); });

Answer 4

I was also suffering from this issue. As William Leung has pointed, IE has a bug with remove Iframe Object from DOM.

Try the following:

$(someDivWithIframe).empty().remove();

Answer 5

This worked for me on IE11,

• Cause of issue (aside from IE being stupid):
  • Focused input element is removed from display inside a iframe (css display property)
• Issue:
  • Text input element can not be clicked on, you can still tab to it however
• Workaround:
  • We need to focus() a known visible element before taking a input field out of display, so on the line before we take the display away from a input field we have the line: document.body.focus();

Answer 6

Just to add to what others said, it is actually a problem when some input in an iframe is having focus which is then closed causing all other inputs to lose focus. And indeed having a script to set focus to an element solves the problem. But for me this wasn't working because some of my inputs were disabled. So the solution that worked for me is below

$("input[type=text]:not([disabled])").first().focus();

Complete snippet as I was using bootstrap modal and the modal had an iframe. I set the focus to an editable field before opening a model and after closing:

var modalInstance = $uibModal.open({
    // modal properties
  });
modalInstance.closed.then(function () {
  $("input[type=text]:not([disabled])").first().focus();
});
modalInstance.opened.then(function () {
  $("input[type=text]:not([disabled])").first().focus();

});