How to set minimum length of password - html

Question

I am currently working on a html form. How do I set the minimum length of the password to 8 so that it will reject any password the user inputs that are less than 8. How to do this?
Here is the code:
<div id="login-form">
<form method="post">
<table align="center" width="30%" border="0">
<tr>
<td><input type="text" name="email" placeholder="Your Email" required /></td>
</tr>
<tr>
<td><input type="password" name="pass" placeholder="Your Password" required /></td>
</tr>
<tr>
<td><button type="submit" name="btn-login">Sign In</button></td>
</tr>
<tr>
<td>Sign Up Here</td>
</tr>
</table>
</form>
</div>

Answer 1

If you are using HTML5 you can use the pattern and required attributes for the input tag:
<input type="password" pattern=".{8,}" required title="8 characters minimum">
<input type="password" pattern=".{8,12}" required title="8 to 12 characters">
Also there is a minlength attribute for input tags but it does not work in some browsers:
<input type="password" minlength="8" required>

Answer 2

You can use the pattern attribute:
<input pattern=".{8,}" type="password" name="pass" placeholder="Your Password" required />

Answer 3

Change your button to :
<button name="btn-login">Sign In</button>
And add this code JavaScript (using jquery) :
$('button[name="btn-login"]').click(function() {
if($('input[name="pass"]').val().length < 8) {
alert('Minimum length = 8');
} else {
$('form').submit();
}
});
Dont forget to add this condition into your PHP code.

Answer 4

You could use minlength and maxlength
As usual, you can use the minlength and maxlength attributes to
establish minimum and maximum acceptable lengths for the password.
This example expands on the previous one by specifying that the user's
PIN must be at least four and no more than eight digits. The size
attribute is used to ensure that the password entry control is eight
characters wide.
Source
But it works on Chrome only at the moment.
Or, as someone already mentioned, you could use pattern.
If your application has character set restrictions or any other
requirement for the actual content of the entered password, you can
use the pattern attribute to establish a regular expression to be used
to automatically ensure that your passwords meet those requirements.
Source

Answer 5

Unfortunately, the minimum length attribute is not supported by the all browsers. Please check this out
Because of this, an alternate method has to used.
I've chosen the using of regex like the below;
<input type="password" name="pass" title="Password must be 8 characters including 1 uppercase letter, 1 lowercase letter and numeric characters" required pattern="(?=.*\d)(?=.*[a-z])(?=.*[A-Z]).{8,}" >

Answer 6

<input type="Password" name="pd" placeholder="Password" pattern=".{8,16}" title="8 or more Character" size=30 pattern="[!##$%^&*][a-z][A-Z][0-9]" required>
This code worked for me. Try this