1

I have modal pop-up in which I have few controls like TextArea, Inputs , dropdowns, DatePickers...

When I click on textbox or datepickers, I am not able to see the cursor(but i can see the focus styles applied) in the controls to type something. For the rest it works fine.. If I use tab key or shift+tab from other controls, then even in inputs I am able to see cursor and type..

This issue is only in IE. It works fine in FF and Chrome...

I have no clue what's going on. Please help me with a workaround or solution...

4
  • what happens when you right click, developer mode, and set it to edge? Oct 27, 2015 at 18:56
  • I am trying it in edge itself.. Oct 27, 2015 at 19:10
  • Yeah, but that doesn't mean thats what the HTML is running as. It could be set to run in ie8 compatibility Oct 27, 2015 at 19:18
  • I knew that its running in Edge. I even double checked by opening developer mode. It shows edge running....... Oct 27, 2015 at 19:56

1 Answer 1

3

I recently stumbled upon the same or a very similar problem.

My site had two modal windows. After closing one modal window and then opening the next one, all text inputs on that one were not usable. When I clicked on an input, it changed its state to focus (CSS styles showed that) but there was no cursor and I was not able to type anything in. It was however possible to focus it manually using jQuery.

After hours of struggle I found this and this.

If an element has focus on it but is removed from the DOM (e.g. closing a modal window), IE is not able to put this focus on other elements.

This is what helped me:

modalWindowDiv.innerHTML = "";
$('#modalWindowDiv').remove();

or

$('#modalWindowDiv').empty().remove();

Just delete the contents of a modal window before removing it from the DOM. That should correctly remove any focus from it.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.