Validation Error State ValueMissing on Page Load for Required Date Pickers

Ask the community
, ,
1

Hi,

Currently the date pickers on my form are being populated with red borders (Error State) on load, they have no date on load which is expected but I would only expect the error to be triggered on submit (my button is configured to submit to a dataset which is working if all fields are populated)

I am running onCustomValidation() within the onReady() handler but for some reason this validation runs as soon as the page loads without me even touching the form and I think it’s flagging the ValueMissing error, any suggestions? Both my Entry and Exit Dates are flagged red but the Entry Time and Exit Time are not

$w("#entryDate, #exitDate, #entryTime, #exitTime").onCustomValidation((value, reject) => {
  	let entryDate = $w("#entryDate");
  	let exitDate = $w("#exitDate");
  	let entryTime = $w("#entryTime");
  	let exitTime = $w("#exitTime");
  	let todayPlusOneYear = new moment().add(365, 'days');
    let validationMessage;

    if (moment(entryDate.value).isSame(exitDate.value) && moment(entryTime.value, 'HH:mm').isSameOrAfter(moment(exitTime.value, 'HH:mm'))) {
  		validationMessage = "Invalid Time, The entry time must be prior to the exit time for the same day bookings.";
      entryTime.validity.valid = false;
      entryTime.updateValidityIndication();
  		reject(validationMessage);
  		$w('#bookingValidationMessage').text = validationMessage;
  		$w('#bookingValidationMessage').expand();
  	} else if (moment(entryDate.value).isAfter(todayPlusOneYear)) {
  		validationMessage = "Invalid entry date, unable to select entry date after 1 year from today.";
      entryDate.validity.valid = false;
      entryDate.updateValidityIndication();
  		reject(validationMessage);
  		$w('#bookingValidationMessage').text = validationMessage;
  		$w('#bookingValidationMessage').expand();
    } else if (moment(exitDate.value).isAfter(todayPlusOneYear)) {
      validationMessage = "Invalid exit date, unable to select exit date after 1 year from today.";
      exitDate.validity.valid = false;
      exitDate.updateValidityIndication();
  		reject(validationMessage);
  		$w('#bookingValidationMessage').text = validationMessage;
  		$w('#bookingValidationMessage').expand();
  	} else {
  		$w('#bookingValidationMessage').collapse();
     
      entryDate.resetValidityIndication();
  		entryDate.validity.valid = true;

      
  		exitDate.resetValidityIndication();
  		exitDate.validity.valid = true;

     
  		entryTime.resetValidityIndication()
  		entryTime.validity.valid = true;

      
  		exitTime.resetValidityIndication()
  		exitTime.validity.valid = true;
  	}
  });
1 Like
2

Hi! Note that validations other than required , including custom validations, are not run on input elements when they don’t have a value. You can learn more here: https://www.wix.com/corvid/reference/$w.ValidatableMixin.html#onCustomValidation
https://support.wix.com/en/article/corvid-about-validating-user-input-with-code

3

So what would cause the date pickers to error? I saw another thread apparently it’s a bug from 2 years ago, not sure how it is not resolved yet…