Hi,
Im trying to create a custom sign up lightbox for new members to sign up.
Everything works fine but the problem is that the form still gets submitted even when the password is invalid. in fact, all input fields has a field in the database except password of course thats why password is not taken in consideration when hitting submit.
Any idea how to solve this?
Thanks in Advance.
Thats how the code looks like:
import wixUsers from ‘wix-users’;
import wixData from ‘wix-data’;
$w.onReady( function () {
let email = $w(‘#emailInput’).value
let password = $w(‘#passwordInput’).value
let firstName = $w(‘#firstName’).value
let lastName = $w(‘#lastName’).value
let phone = $w(‘#phone’).value
let adress = $w(‘#address’).value
const validateEmail = (otherEmailElementId) => (value, reject) => {
let otherEmailElement = $w(otherEmailElementId);
if (value === otherEmailElement.value) {
otherEmailElement.validity.valid = true ;
otherEmailElement.resetValidityIndication();
return ;
}
console.log(“Email and Confirm Your Email fields do not match”);
otherEmailElement.validity.valid = false ;
otherEmailElement.updateValidityIndication();
reject(“Email and Confirm Email fields do not match”);
};
$w(“#emailConfirmInput”).onCustomValidation(validateEmail(“#emailInput”));
$w(“#emailInput”).onCustomValidation(validateEmail(“#emailConfirmInput”));
const validatePassword = (otherPasswordElementId) => (value, reject) => {
let otherPasswordElement = $w(otherPasswordElementId);
if (value === otherPasswordElement.value) {
otherPasswordElement.validity.valid = true ;
otherPasswordElement.resetValidityIndication();
return ;
}
console.log(“Password and Confirm Your Password fields do not match”);
otherPasswordElement.validity.valid = false ;
otherPasswordElement.updateValidityIndication();
reject(“Password and Confirm Password fields do not match”);
};
$w(“#passwordConfirmInput”).onCustomValidation(validatePassword(“#passwordInput”));
$w(“#passwordInput”).onCustomValidation(validatePassword(“#passwordConfirmInput”));
$w(“#PaidMembersDB”).onBeforeSave((event) => {
if (!($w(‘#firstName’).valid && $w(‘#lastName’).valid && $w(‘#emailInput’).valid)) {
if (!$w(‘#firstName’).valid || !$w(‘#lastName’).valid)
$w(‘#NoName’).show();
if (!$w(‘#emailInput’).valid) {
if (!$w(‘#emailInput’).value)
$w(‘#NoEmail’).show();
else if ($w(‘#emailInput’).value !== $w(“#emailConfirmInput”).value) {
$w(‘#EmailsNotMatch’).show();
}
}
if (!$w(‘#passwordInput’).valid) {
if (!$w(‘#passwordInput’).value)
$w(‘#NoPassword’).show();
else if ($w(‘#passwordInput’).value !== $w(“#passwordConfirmInput”).value) {
$w(‘#PasswordNotMatch’).show();
}
}
}
});
});
export function firstName_change(event) {
$w(‘#NoName’).hide();
}
export function lastName_change(event) {
$w(‘#lastName’).hide();
}
export function emailInput_change(event) {
$w(‘#NoEmail’).hide();
}
export function passwordInput_change(event) {
$w(‘#NoPassword’).hide();
}
