Validation

Validate a submitted value before continuing the form flow using javascript.

  • OBS. eval is used.
  • Asyncronous, so a value can be validated through a server
  • three parameters is passed to the method
    • dto: FlowDTO
    • success: () => void //callback
    • error: (optionalErrorMessage?: string) => void //callback
<input type="text" cf-validation="window.lastnameCheck" />
var lastnameCheck = function(dto, success, error){
    console.log("testValidation, dto:", dto, success, error);
    if(dto.text.toLowerCase().indexOf("holmes") != -1)
        return success();
    return error();
};

Using flowStepCallback

var conversationalForm = window.cf.ConversationalForm.startTheConversation({
    formEl: document.getElementById("form"),
    context: document.getElementById("cf-context"),
    flowStepCallback: function(dto, success, error){
        
        if(dto.tag.id == "firstname"){
            if(dto.tag.value.toLowerCase() === "sherlock"){
                return success();
            }else{
                return error();
            }
            //conversationalForm.stop("Stopping form, but added value");
        }else if(dto.tag.name == "gender"){
            if(dto.tag.value[0] === "male"){
                return success();
            }else{
                return error();
            }
        }

        return success();
    }
});

Example using both validation strategies

See the Pen Conversational Forms - Validation by SPACE10 (@space10) on CodePen.