Skip to content

3.4.4. Custom

Ettiene Mare edited this page Mar 11, 2020 · 2 revisions

You can add your own Custom Validator to the workflow engine.
You need to register your validator with the Workflow engine.
The Custom Validator is configured in the process definition.

Specification

The Custom Validator is configured in the process definition.
You need to implement the Validator class.

Html Page

<!DOCTYPE html>
<html>
   <body>
       <polaris-workflow url="wf/settings" process="default"></polaris-workflow>
       <script>
            import {CustomValidator} from "./validators/custom.validator.js"; 

            customElements
                .whenDefined("polaris-workflow")
                .then(() => {
                  const wf = document.querySelector("polaris-workflow");
                  wf.addValidator(new CustomValidator("custom-validator"));
                });     
       </script>    
   </body>
<html>

Process The validator will be linked to the control in the process definition file.

{
    "name" : "my-process",
    "activities": [
        {
            "name": "start",
            "type": "page-activity",
            "controls": [
                { 
                  "tag": "input", 
                  "id": "user.firstName",                        
                  "validators": [
                      { "name": "custom-validator", "message": "The field is required" }
                  ]
                },
            ]
        }
    ]
}

Properties

Property Description
name The name you used to register the component, it will be **custom-validator** in the example
message The error message to be displayed.
properties You can use the properties in your validator.

Custom Validator

import {Validator} from '../../polaris/validators/validator.js';

export class CustomValidator extends Validator {
    validate(context, control, config) {
        const value = +context.model.getValue(control.id);
        const isValid = value !== 13;

        this.setError(control, !isValid, config.message);
              
        return isValid;
    }
}  

Home

  1. Setup

  2. Configure

  3. Design

    3.1.Introduction

    3.2. Core

    3.2.1. Workflow
    3.2.2. Analytics
    3.2.3. Messages

    3.3. Services

    3.3.1. Workflow
    3.3.2. Analytics
    3.3.3. Config
    3.3.4. Model
    3.3.5. Validator
    3.3.6. Http

    3.4. Validators

    3.4.1. Required
    3.4.2. Regex
    3.4.3. Range
    3.4.4. Custom

    3.5. Pipes

    3.5.1. Currency

    3.6. Activities

    3.6.1. Page
    3.6.2. Api
    3.6.3. Assign
    3.6.4. Decision
    3.6.5. Code
    3.6.6. IPC
    3.6.7. Finish
    3.6.8. Redirect
    3.6.9. Switch
    3.6.10. Custom

    3.7. Web Components

    3.7.1. React

Clone this wiki locally