Question

How to bust the cache of a dynamic dropdown base?

  • 16 March 2021
  • 4 replies
  • 40 views

Userlevel 1

Let’s say I have those two dynamic dropdowns in an action (linked to hidden triggers):

inputFields: [
{
key: 'organization',
type: 'string',
dynamic: 'organizationList.id.name',
},
{
key: 'team',
type: 'string',
dynamic: 'teamList.id.name',
},
]

When the end user selects an organization, the team dropdown passes the organization id in its request to the API. Consequently, the the team dropdown is populated only with teams from the selected organization.

perform: async (z, bundle) => {
let params = {}

if (bundle.inputData.organization) {
params.organization = bundle.inputData.organization
}

const options = {
url: `${process.env.HOST}/v1/teams`,
method: "GET",
params
};

return z.request(options).then((response) => {
response.throwForStatus();
const result = z.JSON.parse(response.content);
return result.teams
});
},

Now my question is, if the end user, goes back to the organization dropdown and selects another organization how can we bust the cache of the team dropdown and make another request to the API with the organization id so the teams of this other organization are shown in the dropdown?


4 replies

Userlevel 6
Badge +9

You might try setting altersDynamicFields attribute to true: https://zapier.github.io/zapier-platform-schema/build/schema.html#fieldschema.  I think that’ll accomplish what you need there.

Userlevel 1

You might try setting altersDynamicFields attribute to true: https://zapier.github.io/zapier-platform-schema/build/schema.html#fieldschema.  I think that’ll accomplish what you need there.


I tried this without success, the altersDynamicFields , from my understanding recalls any function defines in inputFields, which is not the case for team dropdown.

But I did also tried, to define the team dynamic dropdown in a function and use altersDynamicFields, with no success.

Userlevel 6
Badge +9

Ah, yeah… Alters dynamic fields will force the trigger to rerun, but it’s not a parameterized request at that point so the data will be the same. 

What you need is a dynamic field, with altersDynamicFields on the other controlling field.  Make sure that function a) references the current selected value of the other field; b) passes this value to your API request to effect the appropriate filtering you’re looking for; and c) you are building and returning a field definition as defined by the schema (linked above).  

 

Here’s an example dynamic field definition (the function body - in the UI this would be the contents of the code field): 

const options = {

  url: 'https://monkey.ngrok.io/vehiclemaker',

  method: 'GET',

  headers: {

    'Accept': 'application/json',

    'x-api-key': bundle.authData['api_key']

  },

  params: {

    'type': bundle.inputData.type

  }

}

 

if (!bundle.inputData.type){

  return { key: 'maker', choices: [ ] }

}

else {

  return z.request(options)

    .then((response) => {

      response.throwForStatus();

      const results = z.JSON.parse(response.content); 

      const field = { key: 'maker', choices: results.map(x => x['id']) }

      return field;

    });

}

Userlevel 1

Worked 🤝 !

Reply