Requirement : The user should not able to type more than 20 characters within the input box.
I have implemented Sweet alert for displaying messages in my Angular project.
Once we click on a button a sweet alert with input type password (popup) will be displayed
I need to restrict the password input to max length of 20
this should happen when the user types not after typing more than 20 characters and then restricting it.
Swal.fire({
title: "Delete My Account",
text: "Please enter your password to delete your account",
input: 'password',
allowOutsideClick: true,
showCloseButton: true,
inputAutoTrim:true,
inputValidator: (value) => {
if ((value).length > 20) {
return 'You cannot enter more than 20 characters';
}
else if (!value) {
return 'Please enter the password';
}
}
}).then((result) => {
if (result.value) {
// console.log("Result: " + result.value);
let password:any = result.value;
console.log(" (password).length : " + (password).length );
if ((password).length > 20) {
Swal.fire( 'Reached Max', 'You cannot enter more than 20 characters', 'error')
return false;
}
this.userPassword = result.value;
this.deleteMyAccount();
}
else if (result.isConfirmed)
{
Swal.fire( 'Password required', 'please enter the password', 'error')
}
});
The above code allows to add N characters to the input and then throwing an error message.
TIA
You should use the maxlength="20" and onKeyPress="if(this.value.length==20) return false;" in the input tag.
input type="text" class="inputcustom" placeholder="Enter the bank account number" formControlName="accountNumber" maxlength="18" onKeyPress="if(this.value.length==18) return false;">