Hi @Sarah Eb I think I know what you’re trying to do, so you have field 1 and field 2, depending on the selection in field1 field 2 will have different options within it. correct?

It’s not so much about having fields appear and disappear, as much as it is about having field 2 be a dynamic field type and field 1 having the box checked for “Alters Dynamic Fields” 

And then for Field2 you need to create the field as a dynamic field. 

Then, use the contents of Field1 to lookup the options for field2, each time the user makes a change or a selection in field 1 the settings in field2 will be re-run to grab a list of options based on what is selected in field1.

Let me know if I need to explain more.

Hi Paul, I had checked the alter dynamic field option for field1. I am facing issues to return the list for field2 after fetching from API, And I also want to show field2 after user selecting some value in field1.

A sample code explaining this configuration for field1 and field2 will be helpful for me.

Thanks

What is the API call you need to make to get the options for the field2?

This is the endpoint for field2 

https://app.engagebay.com/rest/integrations/zapier/field1Val/users

Can Anyone help me with this ?

Hi there @Sarah Eb - Did you still need help? Looks like @PaulKortman was the last person on this conversation so I’ve mentioned him to see if I may be of more assistance.

Thanks!

Hi there!  

Consider this example.  We have a dropdown with vehicle type... based on the user's selection, a dynamic field will be re-rendered with a collection of makers of that vehicle type from our api.

Here’s what the user should see in the Zap editor:

Dynamic Form Screencast

To accomplish this, as noted above, make sure 'alters dynamic fields' is set to true on the dropdown with the dependency value, in our case here the “Vehicle Type” dropdown.  Every time a user makes a selection here it will send a message to all dynamic fields to re-run.

Now create a dynamic field. This is not to be confused with a “dynamic dropdown”.  A dynamic field definition is essentially just a function that returns an array of field objects for the Zap editor to render.  This is an advanced feature and you need to be comfortable writing a little bit of javascript code to get this work.  @PaulKortman helpfully provided a screenshot of the button to create a dynamic field in his post.  Select that and you’ll be greeted with a little UI where you can add some code.  

The code that’s managing the “Maker” dropdown in my screencast example looks like this:

const options = {
  url: 'https://example.com/vehiclemaker',
  method: 'GET',
  headers: {
    'Accept': 'application/json',
    'x-api-key': bundle.authData<'api_key']
  },
  params: {
    'type': bundle.inputData.type
  }
}
z.console.log(`running perform.  inputType is ${bundle.inputData.type}`);

if (!bundle.inputData.type){
  return { key: 'maker', choices: r ] }
}
else {
  return z.request(options)
    .then((response) => {
      response.throwForStatus();
      const results = z.JSON.parse(response.content);      
      const field = { key: 'maker', choices: results.map(x => xm'id']) }
      z.console.log(`here is the dynamic field: ${JSON.stringify(field)}`)
      return field;
    });
}

There we can see I’m passing bundle.inputData.type as a parameter to my API. This was the user’s selection from the dropdown.  I make a call to my API and from the results I dynamically build another dropdown with the results.  This can return a single, or multiple fields. 

Super handy reference for doing this.  This is the schema definition for the field objects your code will need to create.  https://zapier.github.io/zapier-platform-schema/build/schema.html#fieldschema

To test this, make a Zap with your action, and open up the Monitoring panel in the UI to see your console log statements and debug the API requests being made.