JQuery UI Dialog Box: Entering Passwords That Cause Freezing

Question

This is a weird behavior that only seems to happen in Chrome and with the jQuery UI. When you first enter characters in the password field, everything works correctly. However, if you try to backtrack to the last letter in the input, the browser will block all operations on the client side. In addition, if you try to highlight characters entered and pending, client-side operations will freeze.

Just getting to the point that someone ran into this problem and how they solved it.

To experience the problem, we have an automatic dialog opening on 2+ unique home browsing pages. Here is the listing page so it can be launched, I apologize for the inconvenience, but I can’t delete the counter.

Page: http://www.christineleeteam.com/area/eagleharbor

Answer 1

I had the same problem, but clearing the cache did not help. I am sure this is not a jquery ui error. Here is my solution:

$('input[type="password"]').on('keydown', function(event){ if (event.which == 8) { //backspace event event.preventDefault(); $(this).val(''); } }); 

This code clears the entire password field in a single backspace event.

Answer 2

We encountered the same problem and used the Benkod solution. We improved it a bit to handle cases when the password text is deleted using the delete key (and not vice versa). Another case is to select all the text in the control and enter new text to replace it. Here is the script we used:

  Sys.Application.add_load(function() { $('input[type=password]').keydown(function(event) { var isAllTextSelected = this.value.slice(this.selectionStart, this.selectionEnd) == this.value; var isLastChar = $(this).val().length == 1; if (isAllTextSelected && $(this).val().length > 0) { $(this).val(''); } if ((event.which == 8 || event.which == 46) && (isLastChar || isAllTextSelected)) { //backspace event event.preventDefault(); $(this).val(''); } }); }); 

Answer 3

Here's the problem (FWIW, I use Twitter Bootstrap, but the problem was the same). This seems to be caused by the presence of a large amount of content prior to input. Placing the input above - above the main body of other content - did the trick for me. Work around, but better than nothing.