Passing a Custom Field in the Forms from Actions

Overview

 This article provides an example of how to pass a custom field from an action and get the default value set in the action displayed using the custom component of a Form.

Applies To

  • Actions
  • Custom Fields

Solution

Please find below the sample code:

 

Action code:

 

api.prompt.render('ap_**', {
vars: {
      user_code: '123',
}
});

Accessed the value set in action by using {{ vars.user_code }} in the Params

 

 

 

And for the default value, use the below in the Source Code:

 

 

 

function customInput(context) {
    const input = document.createElement('input');
    input.type = 'text';
    function buildInput() {
        const { user_code } = context.custom.getParams();
        input.value = user_code;
        return input;
    }
    return {
        init() {
            console.log(context.custom.getParams());
            return buildInput();
        },
        getValue() {
            return input.value;
        }
    };
}

 

Unlike when populating {{fields.*}} variables, the {{vars.*}} The property does not need to exist in your form before injecting values. The following Auth0 documentation provides more details: Inject custom data with shared variables (server-side)

 

Form fields{{fields.*}}Forms / FlowsReference data from your form fields and hidden fields
Shared variables{{vars.*}}Forms / FlowsReference data stored as shared variables

 

Recommended content

No recommended content found...