CODEWITHSUNDEEP
javascriptvue.jsvalidationvuetify.js
user12763413
user12763413

Reputation: 1349

Vuetify password validation to include special characters, capital letter, number and min length 6 character

I am trying to add password rules in my vue app. I am using vuetify version 2.3.10.

This is what I have so far, and I am not able to figure out how can I add the validation for password to include special characters, capital letter and number.

passwordRules: [
 value => !!value || 'Please enter a password',
 (value) => !!value || 'Please type password.',
 (value) => (value && value.length >= 6) || 'minimum 6 characters',
]

Help me resolve this issue.

Upvotes: 1

Views: 2177

Answers (1)

ikiK
ikiK

Reputation: 6532

Useful topic:

https://stackoverflow.com/a/21456918/7158959

passwordRules: [
 value => !!value || 'Please enter a password',
 (value) => !!value || 'Please type password.',
 (value) => (value && /^(?=.*[a-z])(?=.*[A-Z])(?=.*\d)(?=.*[@$!%*?&])[A-Za-z\d@$!%*?&]{6,}$/.test(value)) || 'Minimum 6 characters, One capital latter, Special charater, Number',
]


console.log(/^(?=.*[a-z])(?=.*[A-Z])(?=.*\d)(?=.*[@$!%*?&])[A-Za-z\d@$!%*?&]{6,}$/.test("hEse%9"))

As requested to brake it down:

passwordRules: [
 value => !!value || 'Please enter a password',
 (value) => !!value || 'Please type password.',
 (value) => (value && /\d/.test(value)) || 'At least one digit',
 (value) => (value && /[A-Z]{1}/.test(value)) || 'At least one capital latter',
 (value) => (value && /[^A-Za-z0-9]/.test(value)) || 'At least one special character',
 (value) => (value && value.length < 6 ) || 'minimum 6 characters',
]


console.log(/^(?=.*[a-z])(?=.*[A-Z])(?=.*\d)(?=.*[@$!%*?&])[A-Za-z\d@$!%*?&]{6,}$/.test("hEse%9"))

console.log(/\d/.test("hE4se%")) // digit
console.log(/[A-Z]{1}/.test("hE4se%")) // Capital latter
console.log(/[^A-Za-z0-9]/.test("hE#4se")) // Special character

Also your length needs to be checked with < 6 I believe.

Upvotes: 4

Related Questions