Input field for PIN code

Question

I want to create a form, where user can enter Email and 4 digit PIN. For PIN input I would like to use <input type="number"> instead of regex, but I don't know how to hide entered digits.

Answer 1

Use the type password and HTML maxlength property:

<input type="password" name="pin" maxlength="4">

http://jsfiddle.net/skxr9o47/

This would require some JavaScript validation to ensure a number was entered.

An alternative way would be to use HTML 5 and take advantage of the number type (As you already have done) or the pattern attribute and validate it inside your form.

<form>
    <input type="text" name="pin" pattern="[0-9]{4}" maxlength="4">
    <input type="submit" value="Validate">
</form>

http://jsfiddle.net/L6n9b5nr/

However, you would have to use JavaScript or jQuery to use mask the user's input.