This article provides instructions for passing variable values from Actions to Forms and then retrieving the submitted form data back into Actions. It covers both server-side and client-side methods for populating form fields.

• Forms
• Actions

There are two methods to pass data from an Action to a Form.

1. Inject server-side variables using the vars property as a second argument in the render method. This can be used to inject sensitive information without exposing it to the client-side.
   
   In this example, the value 123 populates the variable named: sensitive_variable

exports.onExecutePostLogin = async (event, api) => {
  api.prompt.render(':form_id', {
    vars: {
      sensitive_variable: '123',
    }
  });
}

exports.onContinuePostLogin = async (event, api) => {
   // Add your logic after completing the form
  // The form submission data will then be available in the onContinuePostLogin() method within the same Action via the event.prompt.fields object.         
  // You can access the form data based on their field IDs defined in the Form.

  // event.prompt.fields.{name}
  // example: event.prompt.fields.company_name
}

Then reference this syntax in the Form:

• • In a flow node (for example, HTTP request, condition): {{vars.sensitive_variable}}.
  • In hidden fields to forward to a backend.
  • In conditional logic to control flow branching. 

2. Populate values for existing fields and hidden fields using the fields property as a second argument in the render method. Please remember not to populate any sensitive information using this method - populated values are exposed to the browser (client-side).
   
   In this example, the value Matt populates username field. 
   

   exports.onExecutePostLogin = async (event, api) => {
     api.prompt.render(':form_id', {
       fields: {
         username: 'Matt',
       }
     });
   }
   
   exports.onContinuePostLogin = async (event, api) => {
     // Add your logic after completing the form
     // The form submission data will then be available in the onContinuePostLogin() method within the same Action via the event.prompt.fields object.         
     // You can access the form data based on their field IDs defined in the Form.
   
     // event.prompt.fields.{name}
     // example: event.prompt.fields.company_name
   }

   The form field with ID username will be pre-populated with Matt. The user can either see it pre-filled or, if it is a hidden field, it will be submitted silently. Reference field values elsewhere in the form using {{fields.username}}.

    

   
   

Related References

• Render Forms using Actions