Option from one select box triggers loading of options for another select box


Apologies if this has been asked already but I’m looking for some guidance on the following:

I have customized the form tab in the properties panels which loads a list of forms. What I’m trying to do is when you select a form from the first drop down list, is load a set of options for the second select box. In this instance a list of versions for a given form.

Is there any guidance on what the best/recommended approach would be in my custom code?

Promise to make this my last question :slight_smile:

Please share a running / prototypical example that clearly shows what you’re trying to achieve, what is working and what is not.

Use our existing starter projects to quickly hack it or share your existing, partial solution on GitHub or via a CodeSandbox. Provide the necessary pointers that allow us to quickly understand where you got stuck.

This way we may be able to help you in a constructive manner.

Thanks :heart:

Hi there

Here is a codeasandbox example (line 63). The first select box contains a list of form names. Once someone selects the form name I need to make a request to get a list of version numbers for a given form.

OK, so there is a solution to your problem which is based on unstable API:

I’ve found two bugs within the CodeSandbox that you provided which may slow down the implementation:

  1. modelProperty of the selectBox is set to form instead of formKey
  2. concat is used as if it were a mutating method but it’s not:
versions.concat({ name: "Latest", value: "-1" });

This will have no effect as concat returns a new array with an update. Instead, you can use push:

// single element:
versions.push({ name: "Latest", value: "-1" });
// more elements:
// or
versions.push(el1, el2, el3);

Please make sure to fix these issues and read the thread I linked. If you have any additional questions after you try to implement this, please feel free to come back.

Yup I noticed the concat issue…rookie mistake. Thanks for the pointers, I’ll take a look.


1 Like


The first example seems to preload all the data and is passed into the code and filters it. The second link talks about using setControlValue which isn’t an option that I can pass into the selectBox function unless I need to override the SelectEntryFactory?