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

[aminmc]

Hello

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

[barmac]

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

[aminmc]

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.

[barmac]

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

Dynamically load data in properties panel

I’ve done a small work-around on this, I load optional data in an API-call before the modeler opens up. I filter this data based on the value of another property of the element. The only downside of this, is that the element needs to be reselected for it to refresh the selectbox-values. At the moment this is the only part i still hope to solve, but for now i’ll take the loss Here’s an example, this code exists in FormProps.js, it shows the SelectBox-Values based on a Custom Object-attri…

Setting Async data to comboBox in Properties Panel

Hi @nikku, Here is my sample project and i am able to override getTabs method of PropertiesProvider and changing userTask’s Assignee from text box to dropdown with static data.But when i am trying to load dynamic data it is failing. when i replace selectOptions to lazy loaded data in rtCamundaPropertiesProvider.ts file like below private loadEntry() { return entryFactory.selectBox({ id: 'assignee', label: 'Assignee', modelProperty: 'assignee', …

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:
versions.push(...array);
// 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.

[aminmc]

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

Cheers

[aminmc]

Hi

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?