Interface: AsyncValidator

 self.asyncValidator1 = {
   // required validate method
   'validate': function(value) {
     return new Promise(function(resolve, reject) {
       var successful = someBackendMethod();
       if (successful) {
         resolve(true);
       } else {
         reject(new Error('The amount of purchase is too high. It is ' + value));
       }
     });
   },
   // optional hint attribute. hint shows up when user sets focus to input.
   'hint': new Promise(function (resolve, reject) {
     var formattedMaxPurchase = getSomeBackendFormattedMaxPurchase();
     resolve(maxPurchase + " is the maximum.");
   });
 };
 -- HTML --
 <oj-input-text value="{{value}}"
 async-validators="[[[asyncValidator1]]]"></oj-input-text>

Fields

hint :Promise.<string>

PREVIEW: This is a preview API. Preview APIs are production quality, but can be changed on a major version without a deprecation path.

hint is an optional attribute. It is a Promise that resolves to the hint string.

Example

Create an Object that duck-types the oj.AsyncValidator interface. Bind the Object to the JET form component's async-validators attribute. The validator's 'hint' will be called when the user focuses on the input and it shows up as a notewindow giving the user a hint to what the validator will do.

 self.asyncValidator1 = {
   // required validate method
   'validate': function(value) {
     return new Promise(function(resolve, reject) {
       var successful = someBackendMethod();
       if (successful) {
         resolve(true);
       } else {
         reject(new Error('The amount of purchase ' + value +' is too high.'));
       }
     });
   },
   // optional hint attribute. hint shows up when user tabs to input.
   'hint': new Promise(function (resolve, reject) {
     // resolve the credit score REST call, and figure out what
     // is the maximum purchase dollar amount.
     var formattedMaxPurchase = getFormattedMaxPurchase();
     resolve('Your max purchase amount is ' + formattedMaxPurchase);
   });
 };
 -- HTML --
 <oj-input-text value="{{value}}"
 async-validators="[[[asyncValidator1]]]"></oj-input-text>

Methods

validate(value) → {Promise.<boolean>}

PREVIEW: This is a preview API. Preview APIs are production quality, but can be changed on a major version without a deprecation path.

A method that validates the value. The function returns a Promise that resolves to true if the validation passes or a Promise that rejects with an error if it fails. The error will be shown on the component.

It is recommended that you show the value you are validating in the error message because if the async operation takes a while, the user could be typing in a new value when the error message comes back and might be confused what value the error is for.

If you need to format the value for the error message, you can use oj.IntlConverterUtils.getConverterInstance(converterOption); to get the converter instance, then call converter.format(value);

Parameters:

Name	Type	Description
value	any	to be validated

Returns:

A Promise that evaluates to boolean true if validation passes or rejects with an Error if validation fails.

Type

Promise.<boolean>

Example

Create an asynchronous validator and use it on an EditableValue component. First, create an Object with 'validate' method that returns a Promise. Then, bind it to the JET form component's async-validators attribute.

 self.asyncValidator1 = {
   'validate': function(value) {
     return new Promise(function(resolve, reject) {
       var successful = someBackendMethod();
       if (successful) {
         resolve(true);
       } else {
         //NOTE: if you need to format the value using a converter, you can call
         // oj.IntlConverterUtils.getConverterInstance(converterOption); to get the
         // converter instance, then call converter.format(value);
         reject(new Error('The amount of purchase ('+value+') is too high.'));
       }
     });
   }
 };
 -- HTML --
 <oj-input-text value="{{value}}"
 async-validators="[[[asyncValidator1]]]"></oj-input-text>