# Dropdown Box Query

**URL:** <https://forum.inductiveautomation.com/t/dropdown-box-query/79496>\
**Category:** Ignition\
**Created:** [September 22, 2023, 9:49am UTC](https://forum.inductiveautomation.com/t/dropdown-box-query/79496 "2023-09-22T09:49:01Z")\
**Posts on this page:** 2\
**Page:** 1

<div class="post-metadata">

**Author:** ![Shubham\_Nikate](https://avatars.discourse-cdn.com/v4/letter/s/91b2a8/32.png) [@Shubham\_Nikate](https://forum.inductiveautomation.com/u/Shubham_Nikate)\
**Post date:** [September 22, 2023, 9:49am UTC](https://forum.inductiveautomation.com/t/dropdown-box-query/79496/1 "2023-09-22T09:49:01Z")

</div>

I have placed dropdown box in ignition dashboard in which I have form 3 column named group 1, group 2, group 3, now I want that when I select one then subcomponent will get display in form of in another drop downlist so how can I do that?

---

<div class="post-metadata">

**Author:** ![justinedwards.jle](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/justinedwards.jle/32/37854_2.png) [@justinedwards.jle](https://forum.inductiveautomation.com/u/justinedwards.jle)\
**Post date:** [September 25, 2023, 2:20pm UTC](https://forum.inductiveautomation.com/t/dropdown-box-query/79496/2 "2023-09-25T14:20:14Z")

</div>

First, add a custom property to the second dropdown called `masterDataset`  
 ![image](https://us1.discourse-cdn.com/inductiveautomation/original/3X/6/f/6fbfac713c572f437be729bf878adda48ac80191.png)

![image](https://us1.discourse-cdn.com/inductiveautomation/original/3X/7/4/746ce5ec0b799d13f1e22839c58cade8eab195eb.png)

Add columns for value, and every other category  
 ![image](https://us1.discourse-cdn.com/inductiveautomation/original/3X/f/0/f0130d14f61b1fd124674143fb242e56b365c548.png)

Populate it with all of the data.  
When completed, it should look like this:  
 ![image](https://us1.discourse-cdn.com/inductiveautomation/original/3X/b/0/b08c85d19a968fc4c52c791c46294357c6f90943.png)

Finally, right click on the first dropdown, and select scripting:  
 ![image](https://us1.discourse-cdn.com/inductiveautomation/original/3X/a/7/a7356051ddce124bd12b51110e16ce228eb9ee71.png)

Put a script into the propertyChange event handler that loops through and pulls out the data you want based upon the selection in the first dropdown:

 ![image](https://us1.discourse-cdn.com/inductiveautomation/original/3X/0/4/0412515326378e801018e98f7812a69a15197bda.png)

```auto
# Check if the event's property name matches 'selectedLabel'.
# This prevents the script from firing when any of the other properties change 
if event.propertyName == 'selectedLabel':

	# Fetch the 'masterDataset' from the custom property on 'Dropdown 2'
	masterData = event.source.parent.getComponent('Dropdown 2').masterDataset
	
	# Define the column headers for the new dataset.
	headers = ['Value', 'Label']
	
	# Create a sublist by looping through each row of the masterData.
	# For each row, we fetch 'value' and 'Type' columns. Only include rows where the 'Drink' column matches the new value of the event.
	sublist = [[masterData.getValueAt(row, 'value'), masterData.getValueAt(row, 'Type')]
				for row in range(masterData.rowCount)
				if masterData.getValueAt(row, 'Drink') == event.newValue]
	# Convert the created sublist into a dataset with the previously defined headers.
	subData = system.dataset.toDataSet(headers, sublist)
	
	# Update the 'data' property of the 'Dropdown 2' component with the newly created dataset.
	event.source.parent.getComponent('Dropdown 2').data = subData

```

**Result:**  
 ![image](https://us1.discourse-cdn.com/inductiveautomation/original/3X/5/d/5d209e8ba61d4eb613941240cfd3a59c0b0979c3.png)
