I have a page where I’m doing a custom validation on the zip code field. When I set the validity to false on this field, it updates the validity on all of the fields on the form. I can’t figure out what I’m missing. Here is my code
$w.onReady(function () {
const validateZip = () => (value, reject) => {
console.log("Starting validateZip");
fillCityStateByZip($w('#serviceLocationPostalCode').value)
.then(json => {
let city = json.city;
let state = json.state;
if (json !== undefined && city === undefined){
$w('#serviceLocationPostalCode').validity.valid = false;
$w('#serviceLocationPostalCode').resetValidityIndication();
reject("Invalid ZipCode");
}else{
$w('#serviceLocationCity').value = city;
$w('#serviceLocationState').value = state;
$w('#serviceLocationPostalCode').validity.valid = true;
}
})
.catch(error => {
$w('#serviceLocationPostalCode').validity.valid = false;
$w('#serviceLocationPostalCode').validationMessage="Invalid ZipCode";
reject("Invalid ZipCode");
});
}
$w('#serviceLocationPostalCode').onCustomValidation(validateZip());
Yes, I’ve read the documentation. The validation check is working fine. My problem is that when I set the validity of one field as False, it updates the validity of all fields to False and I don’t know why.
Hi - I’m having this same issue - did you ever find a resolution to this?
I’m validating two URL feeds with slightly different rules. If both are OK the form submits as expected, but once something is submitted Invalid, it sets both fields as Invalid, and will not then set them back to Valid even when errors are corrected. The console log shows them correctly going back to Valid in this scenario, but something around onBeforeSave seems to be making them Invalid when you hit Submit.
Code below - any ideas?
Thanks
Tom
$w.onReady(function () {
//URL VALIDATION
var errorMessages = {
imageErrorMessage: '',
audioErrorMessage: '',
}
var validationMessage = ''
var audioExtensions = ["mp3", "m4a"]
var imageExtensions = ["png", "jpg"]
const validateUrl = (urlToValidateId, fileType, extensions, errorMessageTarget) => (value, reject) => {
let errorMessage = ''
let urlToValidate = $w(urlToValidateId); // TOLOWERCASE HERE???
let httpsErrorMessage = fileType + " URL must start with https://\n"
let extensionsErrorMessage = fileType + " files must end with one of the following extensions: " + extensions + "\n"
if (urlToValidate.value == undefined || urlToValidate.value == '') { // IGNORE BLANK BOXES - IE SET AS OK
console.log(fileType + " IS BLANK")
setValidity(true)
return
}
if ((urlToValidate.value.startsWith("https://") == true) && (checkExtensions(extensions) == true)) { // IF THE URL STARTS HTTPS + HAS AN APPROVED EXTENSION - IE LINK IS OK !
console.log(fileType + " - valid on both fronts")
setValidity(true)
return;
}
if ((urlToValidate.value.startsWith("https://") == false) && (checkExtensions(extensions) !== true)) { // IF BOTH HTTPS AND EXTENSION ARE BAD
errorMessage += httpsErrorMessage + extensionsErrorMessage
console.log(fileType + " - extension & https:// not valid. Should reject now")
setValidity(false)
return
}
if (!(urlToValidate.value.startsWith("https://"))) { // IF JUST HTTPS IS BAD - EXTENSION OK
errorMessage += httpsErrorMessage
console.log("should only run if just https:// that is invalid")
setValidity(false)
return
}
console.log(fileType + " - extension ASSUMED to be not valid") // IF JUST EXTENSION IS BAD - HTTPS OK
errorMessage += extensionsErrorMessage
setValidity(false)
return
function setValidity(isValid) {
console.log("setValidity running")
console.log("url to validate = " + fileType)
urlToValidate.validity.valid = isValid; /// SET VALIDITY TO TRUE/FALSE
urlToValidate.updateValidityIndication(); // AND UPDATE ITS INDICATION
console.log("updated validity:" + urlToValidate.valid)
if (isValid == false) {
errorMessages[errorMessageTarget] = errorMessage // SET APPROPRIATE ERROR MESSAGE
reject("reject: " + errorMessage); // AND WRITE THE REJECTION MESSAGE
return
}
errorMessages[errorMessageTarget] = '' //resets error message if validity now = true
return
}
function checkExtensions() {
console.log("extensions runnning: " + extensions)
for (var i = 0, len = extensions.length; i < len; i++) {
console.log("tested extension " + i)
if (urlToValidate.value.endsWith(extensions[i]) == true) {
console.log("extensions found to be OK")
return true
}
}
}
}
//SPECIFY THE FIELDS TO VALIDATE:
$w("#audioUrlInput").onCustomValidation(validateUrl("#audioUrlInput", "Audio", audioExtensions, 'audioErrorMessage')); // CALL THE FUNCTION ABOVE
$w("#imageUrlInput").onCustomValidation(validateUrl("#imageUrlInput", "Image", imageExtensions, 'imageErrorMessage')); // CALL THE FUNCTION ABOVE
$w('#dataset1').onBeforeSave(() => {
if (!($w('#audioUrlInput').valid && $w('#imageUrlInput').valid)) { // IF ANYTHING IS INVALID
console.log("ONE OR BOTH ARE INVALID")
validationMessage = errorMessages['audioErrorMessage'] + errorMessages['imageErrorMessage'] // SET VALIDATION MESSAGE
console.log("validation message :" + validationMessage)
$w('#validationMessages').text = validationMessage; // APPLY THE TEXT TO THE BOX
$w('#validationMessages').expand(); // SHOW THE BOX
console.log("audio validity: " + $w('#audioUrlInput').valid)
console.log("image validity: " + $w('#imageUrlInput').valid)
} else if ($w('#audioUrlInput').valid && $w('#imageUrlInput').valid) {
console.log("NEITHER ARE INVALID - SHOULD ACCEPT")
validationMessage = ''
$w('#validationMessages').collapse(); // HIDE THE BOX IF NOTHING INVALID
}
})
})
Hello,
Having the exact same problem.
Can any of the Wix dudes step forward?
While setting one field’s validity to false, it makes all other false as well.
Did this ever get answered? I just found this happening in my code also.