---
title: "Better HTML Password Fields for Mobile ?"
description: "There is a particular issue that most of us would have noticed with few mobile devices in portrait with T9 (predictivetext)."
url: "https://h3manth.com/scribe/better-html-password-fields-mobile/"
canonical_url: "https://h3manth.com/scribe/better-html-password-fields-mobile/"
markdown_url: "https://h3manth.com/scribe/blog/better-html-password-fields-mobile.md"
publishDate: "2013-02-08T00:00:00.000Z"
author: "Hemanth HM"
category: "javascript"
tags: ["javascript","web"]
word_count: 263
reading_time_minutes: 2
x_markdown_tokens: 549
content_signal: "ai-train=yes, search=yes, ai-input=yes"
---

# 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 (predictivetext).

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?](http://stackoverflow.com/questions/632167/should-users-be-allowed-to-entered-a-password-with-a-space-at-the-beginning-or-e) 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](http://api.jquery.com/event.preventDefault/) to prevent the default action of spacebar.

```javascript
$(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](http://h3manth.com/demo/better-password.html)

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!)