I would like to thank you for this library.
I am refactoring my javascript code to remove any script that uses jQuery
.
I am currently replacing the jquery-validation:1.19.5
library, while doing research I found this one, and I would like to know if it will suit me in my use cases.
Below is a general use case
Register Form
![Capture d’écran 2023-10-01 à 18 41 25](https://private-user-images.githubusercontent.com/12732173/271844520-370146ba-b3b0-4ecc-8240-198e60a2493a.png?jwt=eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJnaXRodWIuY29tIiwiYXVkIjoicmF3LmdpdGh1YnVzZXJjb250ZW50LmNvbSIsImtleSI6ImtleTUiLCJleHAiOjE3MjQ0MjI1MjIsIm5iZiI6MTcyNDQyMjIyMiwicGF0aCI6Ii8xMjczMjE3My8yNzE4NDQ1MjAtMzcwMTQ2YmEtYjNiMC00ZWNjLTgyNDAtMTk4ZTYwYTI0OTNhLnBuZz9YLUFtei1BbGdvcml0aG09QVdTNC1ITUFDLVNIQTI1NiZYLUFtei1DcmVkZW50aWFsPUFLSUFWQ09EWUxTQTUzUFFLNFpBJTJGMjAyNDA4MjMlMkZ1cy1lYXN0LTElMkZzMyUyRmF3czRfcmVxdWVzdCZYLUFtei1EYXRlPTIwMjQwODIzVDE0MTAyMlomWC1BbXotRXhwaXJlcz0zMDAmWC1BbXotU2lnbmF0dXJlPTQ1MjM1NjBmMzNlMDU4OWI2ODAxYzAyZWUxYjBmZGY1OWE5N2IxZDZhYTcwMzY0N2ZmNTAzYmI0ZDJkNGM4YzYmWC1BbXotU2lnbmVkSGVhZGVycz1ob3N0JmFjdG9yX2lkPTAma2V5X2lkPTAmcmVwb19pZD0wIn0.8J8nmMZKPsuPwJ7ryr-I7eL9NMgSF2JvasDbjo2yT-o)
const phoneNumberSelector = document.querySelector("#phone_number")
const countryIso = document.querySelector("#country_iso")
const intlInput = (await import("Utils/IntelInput")).intl(phoneNumberSelector)
// Add custom method to validate phone number
$.validator.addMethod("validPhoneNumber", value => {
if (value !== "") {
const formattedNumber = intlInput.getNumber(), isValid = intlInput.isValidNumber()
phoneNumberSelector.value = formattedNumber
if (isValid && value.length > 8) {
phoneNumberSelector.value = formattedNumber
countryIso.value = intlInput.getSelectedCountryData().iso2
}
return isValid
}
return true
}, "Please enter a valid phone number.")
$("#form").validate({
lang: "ar", // Define errors language
rules: {
gender: { // Radio button
required: true,
},
firstname: {
required: true,
},
lastname: {
required: true,
},
email: {
required: true,
email: true,
},
phone_number: { // Input field
required: true,
validPhoneNumber: true, // Custom validation method
},
password: {
required: true,
minlength: 8,
},
password_confirm: {
required: true,
minlength: 8,
equalTo: '#password',
},
},
})
$("#form").on("submit", function (e) {
resetFormErrors($(this))
if (!$(this).valid()) {
e.preventDefault()
}
})
The $.validator.addMethod()
signature is:
name
the name of the method used in the rules.
callback
function to validate the field, it's return true if no error, false otherwise.
message
used to display message error if callback
returns false.
In the $.validate()
params we can specify the language used.
Finally, my question is.
Can this library satisfy this use case ?
thanks in advance.