Validation code UI

ionic-v1
1

Is it possible to get UI like this http://cdn.pttrns.com/pttrns/3095/small/IMG_0563.PNG

2

If you are talking about the keypad having only tel type, then it can be done using HTML5.
<input type="tel"> or <input type="number"> is what you are looking for.

Source: http://ionicframework.com/html5-input-types/#tel

3

Hi Keval ,
Please take a look at
http://jsfiddle.net/JLyn9/2/
This is what I want but it is not working with backspace .

4

Not an ideal way to do this; but I am travelling and so, for now I have this workaround:

else if(field.value.length == 0) {
    var a = parseInt(field.id) - 1;
   document.getElementById(a).focus();
}

PS: You need to keep those IDs as integers now. So your HTML will look like:

<input type="password" maxlength=1 id="1" onkeyup="moveOnMax(this,'2')" />
<input type="password" maxlength=1 id="2" onkeyup="moveOnMax(this,'3')" />
<input type="password" maxlength=1 id="3" onkeyup="moveOnMax(this,'4')" />
<input type="password" maxlength=1 id="4" onkeyup="moveOnMax(this,'5')"  />
5

Thanks Keval for figuring this out :slight_smile:
If you found any other way to achieve this Please let me know.
Thanks again!