Form button, trigger action instead of flow?

Get Help
,
1

Hi all,

I have a form that collects text from 2 text inputs. From there i need to collect the inputs and then run 2 http calls, one for a token the other for the response needed.

When i get a response i either need to continue or display the error message back into the form so the user can try again.

Is it possible to listen to the click events in a form? The flow http fucntion is very basic and doesnt allow for the repsonse to be used with actions and logic.

Below is an example of what I need.

/**
* Handler that will be called during the execution of a PostLogin flow.
*
* @param {Event} event - Details about the user and the context in which they are logging in.
* @param {PostLoginAPI} api - Interface whose methods can be used to change the behavior of the login.
*/
exports.onExecutePostLogin = async (event, api) => {

      api.prompt.render(event.secrets.FORM_ID);

      const input1 = event.prompt.fields.input1
      const input2 = event.prompt.fields.input1

      const button = event.prompt.id = 'button1'

      button.onclick () => {
        // GET A TOKEN
        const getToken = await fetch(url)
        const token = getToken.response()

        // GET THE DATA
        const getData = await fetch(url, token)
        const data = getData.response()

        if(data.err){
          api.prompt.render(':form_id', {
              vars: {
                errmsg: '123',
              }
            });
        } else {
          return;
        }
      }

};
3

Hi @kurt.dunn and thank you for your question!

Please allow me some time to look into this, and I will get back to you as soon as possible.

Thanks!
Teodor.

4

Hi again @kurt.dunn !

You can’t attach onclick listeners inside an Action because the Action code runs on the server, not in the user’s browser.

Instead, you handle this by:

  1. Rendering the form and stopping execution.
  2. Restarting the Action from the top when the user submits the form.
  3. Detecting the submitted data and then running your HTTP calls.
  4. Conditionally re-rendering the same form with an error if your calls fail.

I hope this answers your question!
Teodor.