Dropdown value not updating consistently when dependent dropdown changes

Neutrinos Platform
1

I am facing an inconsistency issue with dependent dropdowns.

When I update the value of the first dropdown, it is supposed to update the options/value of the second dropdown. However, the second dropdown does not update immediately. But the local value is updated .

The update only appears:

  • when I hover over the dropdown, or

  • when I click somewhere inside the dropdown,

  • and sometimes it does not update at all.

This results in inconsistent behavior and makes the UI unreliable.

Expected Behavior

The second dropdown should update immediately whenever the first dropdown value changes.

Actual Behavior

The second dropdown updates only after a hover or click event, and sometimes not at all.

Additional Notes

This looks like a UI re-render or state update issue, where the dependent dropdown is not refreshing when the value changes programmatically.

Has anyone faced a similar issue or can suggest a proper solution?

@Eldho @Sam

2

Hello @dhishon ,

It seems that the second dropdown is not updating in a timely manner. You can try using the custom event mentioned below on the parent dropdown to force a refresh of the second dropdown and update its values.

Please try this approach and let me know if it helps.

const dropdown = ap.$('second-dropdown-id');
dropdown.dispatchEvent(
  new CustomEvent('alpha-renderer:dataSource', {
    detail: { refresh: true },
  })
);
1 Like
3

Thanks @Sam it worked .