Populate dropdown

[Yvette_s_Channe]

I have a form that has 4 dropdowns

I would like the form to populate DowpDown #4 based on the selections in Dropdowns1, 2 and 3

Currently:

1st dropdown the user would select Mom

2nd dropdown the user would select Dad

3rd dropdown the user would select 1 child

the 4th dropdown would only display from this list: Nanny and Babysitter. All other options would not be available for the user to select.

Thank you in advance for your help.

[Anudeep_Garnepudi · Accepted solution]

@Yvette_s_Channe 

Try the below code snippet.

let ddOneValue = $(".cq-dialog").find("#dropdown-one")[0].selectedItem.value;
let ddTwoValue = $(".cq-dialog").find("#dropdown-two")[0].selectedItem.value;
let ddThreeValue = $(".cq-dialog").find("#dropdown-three")[0].selectedItem.value;

let ddFourField = $(".cq-dialog").find("#dropdown-four")[0];

let optionsJson = [];
if (ddOneValue == "Mom" && ddTwoValue == "Dad" && ddThreeValue == "1-child") {
	let obj1 = {
				"text":"Nanny",
				"value":"nanny"
			};
	let obj2 = {
				"text":"Babbysitter",
				"value":"babbysitter"
			};
	optionsJson.push(obj1);
	optionsJson.push(obj2);
}
let optionItems = ddFourField.items;
optionItems.clear();
for (var i = 0; i < optionsJson.length; i++) {
	let obj = new Object();
	let cnt = new Object();
	obj["value"] = optionsJson[i].value;
	cnt["textContent"] = optionsJson[i].text;
	obj["content"] = cnt;
	optionItems.add(obj);
}

All #dropdown-xxx are granite:id to coral select fields. 

Depending upon your use case, create optionsJson dynamically in best possible way.  

[VeenaVikraman]

@Yvette_s_Channe Is the form on a page or you are talking about tabs and dropdown in Dialog ? 

[Yvette_s_Channe]

Thank you for responding, my form has dropdown lists. I would like the user to be able to select from the Canopy dropdown list, but if they change their mind and select something else the entire form resets. Currently this is what I have "xfa.host.resetData();" and it only resets the current subform, not the entire form. Thank you in advance.

[Yvette_s_Channe]

Thank you, I actually changed the form to tables. Now when the user clicks "Add" it will add another subform. They enter information into this subform, but it duplicates rows. Is there a script that I can use to put into the subforms to look for duplicates and delete the duplicated row?