Field Validation

  • Updated
Properties

Field validation is a rule to check the value entered by the user is as required. If the value entered is not according to the rule an error message appears to the user.

Status

Release Available

Status

Framework Name

Initial

Current

TBC

Code JSON

"fieldUi": {
    "required": true,
    "regex": "^(\\+)?(\\d{9,14})$",
    "messages": {
      "requiredErrorText": "..."      "regexErrorText": "..."      ...
    }

}
Status

Release Available

Status

Framework Name

3.2

Current

TBC

Code JSON

{ "fieldName": "annualRevenue",
  "fieldUi": {
    "fieldType": "currency",
    "label": "Annual business revenue",
    "required": true,
    "validation": [{
      "rule": "$this.attr(annualRevenue); >= 50000",
      "message": "Minimum of $50,000 annually"    }],
    "messages": { "requiredErrorText": "Minimum of $50,000 annually" }
  }},

Code JSON

"validation": [{
  "rule": "$this.attr(borrowedAmount); <= $global.attr(offeredAmount);",
  "message": "You can borrow up to <span class=\"font-weight-bold\">$global.attr(offeredAmount, currency);</span>."}],

Field Validation with Custom JS Code

Status

Release Available

Status

Framework Name

3.2

Current

TBC

Code JSON

"fields: [{
  "fieldName": "Birthdate",
  "fieldUi": {
    "fieldType": "date",
    "validation": [{
      "rule": "$ext.confirmAge",
      "arguments": ["$this.attr(Birthdate);", 21],
      "message": "You have to be 21 years old."    }],
  ...}]
Implementation Example

  • Use case: validate the customer is at least 21 years old based on his/her date of birth

Code JSON

{
  "fieldName": "Birthdate",
  "fieldUi": {
    "fieldType": "date",
    "label": "Date of Birth",
    "required": true,
    "regex": "^([12]\\d{3}-(0[1-9]|1[0-2])-(0[1-9]|[12]\\d|3[01]))$",
    "messages": { "regexErrorText": "Enter a valid date of birth." },
    "validation": [{
      "rule": "$ext.confirmAge",
      "arguments": [ "$this.attr(Birthdate);", 21 ],
      "message": "User has to be 21 years old"      
    }]...

  • The external JS function returns a Boolean value for validation pass or fail

Code JSON

(portalext => {
  portalext.confirmAge = (dateValue, minAge) => {
    if (moment) {
      const years = moment().diff(dateValue, "years", false);
      return years >= minAge;
    } else {
      return false;
    }
  };
})((window.portalext = window.portalext || {}));

In This Article