JavaScript - Extending Outcome Validation

1 Overview

Extending the validation of outcomes on the page involves you using custom JavaScript and knowing a little about how the validation engine works.

The primary validation of the page is done in a function called

function js_fn_Master_Validation_Script(obj) {

This function uses two variables called blError and strError_Message.

If blError == true then the page will not submit. The message that the user sees is in the strError_Message variable.

The function is called when the Submit button on the page is pressed.

Each outcome gets its own discrete set of rules

if (obj.value == 'Save Test') {

}

Validation can be done using the standard outcome validation constructors.

Main Menu > Form Management > Form - Outcome Manager > Outcome - Edit > Choose your Form > Choose the outcome > JavaScript > Validation

However further customisation can be done through

Main Menu > Form Management > Form - Outcome Manager > Outcome - Edit > Choose your Form > Choose the outcome > JavaScript > JavaScript This section injects custom JavaScript into this js_fn_Master_Validation_Script function.

2 Worked Example

If you wanted to add validation to an outcome to check if text was in a box. Firstly work out the Form specific name of the field we want to validate. e.g. strCDA_X_field_0_1. If you click the pencil icon to the right of the question, at the very top of the editing page, you will see the name there.

So if we want to check the content has some values then...

// Firstly we work out how long is the data that has been typed into the box
var intLength_CDA_X_field_0_1 = document.getElementById('strCDA_X_field_0_1').value.length;


// If the length of the content is 0, then nothing has been typed in.
if (intLength_CDA_X_field_0_1 == 0) {


  // Firstly we tell bxp that we have found a validation error.
  blError = 'True';


  // Along with any other validation messages, we tell the user how to correct the issue.
  // Please make your error messages helpful to your users so they know how to fix the issue
  strError_Message = strError_Message + 'Please type something into the strCDA_X_field_0_1 field.';


}

From here you can add as many rules as you like to the outcome with as much custom validation as you require.

3 Function injection

Putting in lots and lots of validation in an outcome can make the code difficult to manage over time. Especially if the validation repeats. e.g. 4 outcomes with the same validation. If there is an update there are four validation routines to use rather than 1.

When this occurs it can be useful to "abstract" the validation to a centralised function. Put your validation function into the onLoad of the Form. Then all outcomes can access it. So we in two steps.

3.1 Step 1

Firstly we create a centralised validation function that returns text.

function fn_CentralValidation() {

  var strMyErrorMessage = '';
  var intLength_CDA_X_field_0_1 = document.getElementById('strCDA_X_field_0_1').value.length;

  if (intLength_CDA_X_field_0_1 == 0) {
    strMyErrorMessage  = strMyErrorMessage  + 'Please type something into the strCDA_X_field_0_1 field.';
  }
  return strMyErrorMessage ;

}

3.2 Step 2

Now with that in place, we can put into each outcome....

var strMessage = fn_CentralValidation();
if (strMessage.length > 0){
  blError = 'True';
  strError_Message = strError_Message + strMessage;
}