How can I add a Custom Client side validation?

Written Oct 9, 2012 05:07

You can create a custom validation by adding a validation function in a Load JS action in the ON Load event.

This example shows a regex test but you can use any function that returns true and false.

function customCheck(el){
  if ( !el.value.test(/Add regex for a test here/) ) {
    el.errors.push("Add an error message here");
      return false;
  } else {
    return true;
  }
}

Then add this into the Class box of the element that you want to validate:

 validate['required','%customCheck']

It may be helpful to change customCheck to a more meaningful name for this validation. You must do this if you have more than one custom validation.

ChronoForms v5

In CFv5 the syntax has changed a little:

function customCheck(el){
  if ( !el.val().match(/Add regex for a test here/) ) {
    return false;
  } else {
    return true;
  }
}

And add the error message to the Title attribute of the element you are validating.

To call the function in CFv5 scroll to the bottom of the Validation tab and put the function name in the Custom function box e.g. customCheck

FAQs

ChronoForms v5