Better HTML password fields for mobile ?

There is a particular issue that most of us would have noticed with few mobile devices in portrait with T9 (predictive_text) enabled : "To avoid prediction we have to use a lot of spaces and backspace".

Let me elaborate :

Say the password is : Pa55w0rd

In a mobile devices in portrait with T9 one would type : P[space] [backspace]a[space][backspace]...so on.

So would be good not to read the spaces?

Well, there may be many pros and cons here, this is just a first cut trying to slove this. (There might be better solutions out there)

Do read Should users be allowed to entered a password with a space at the beginning or end? so passwords can contain spaces, so defaults is prevented only for non consecutive spaces, there by to get a single space the user needs to key-in two spaces, this is closet fix so far.

Code:

The javascript code is pretty simple, makes use of the jQuery's Prevent defaults to prevent the default action of spacebar.

$(document).ready(function () {
    $('#inputid').bind('keypress', function (e) {
        // Prevent default if not consecutive spaces
        if ( undefined !== this.lastKey 
             && e.which == 32 
             && parseInt(this.lastKey) != 32) {
              e.preventDefault();
        }
        alert(e.defaultValue);
        this.lastKey = e.which;
    });
});

It's simple, but yet effective! Check out the DEMO

P.S : This need not just be for mobile devices only! :)

Update 0 :

Some solutions people suggested :

  • Turn off T9 prediction ? (Well i'm lazy!! )
  • Give a notification saying trun off T9 (How good?)
  • T9 must handle it! (That seems best!)
Share this