I have 2 identical dropdown menus on the same page where users can select their province of residence. If they select a province in one dropdown menu, I want it to automatically change the value of the 2nd dropdown menu to match the same province as the first.
How can I set each dropdown menu to automatically update the value of the other as each is changed?
Probably the simplest way is to use a custom state to hold the selected value, and set the default value of both dropdowns to be the custom state value.
When the input of either dropdown is changed, run a workflow to set the custom state to the dropdown’s value and reset the relevant inputs.
Create a custom state somewhere (on the page is probably best) that has the same ‘type’ as your dropdown menus. Call it something like ‘Selected Province’ so you know what it is.
Set the default value for both dropdown menus to the value of the ‘Selected Province’ custom state.
Then create an element event workflow that triggers when dropdown A’s value is changed, with the first action to set the ‘Selected Province’ custom state value to this dropdown’s value, and a second action to reset relevant inputs.
Create a second identical workflow, but for dropdown B.
That way, whenever dropdown A’s value is set or changed, dropdown B will automatically update to the same value, and vice-versa.