Getting the selected label of a dropdown

Ignition Early Access
1

How do I get the selected label/text of the dropdown? I get the selected value by using the following code.

self.getSibling(‘drReasonCode’).props.value

I am using it in the click event of a button

2

This may not be the most elegant solution, I’ve added a property on the drop down, ‘selected’.
On the ‘selected’ property I’ve added a property binding with a script transform.

this.props.value

if value == “”: #account for no selection on dropdown
returnValue = “”
else:
returnValue = self.props.options[value].label
return inter

Once that’s added, rather than self.getSibling(‘drReasonCode’).props.value
use the self.getSibling(‘drReasonCode’).props.selected

3

To expand on Sam’s answer, especially if you don’t use integers as your option values:

Create a custom property on the dropdown component with the key ‘selectedLabel’.
Create a Property binding for selectedLabel, linked to this.props.value.
Add a Script transform with the following code:

x = None
for i in range(len(self.props.options)):
	if self.props.options[i].value == value:
		x = self.props.options[i].label
		break
return x

As Sam mentioned, you can then reference self.getSibling('drReasonCode').custom.selectedLabel in your event script.

9 Likes
4

Look also at the placeholder property for this… I’ve used that for when I have no selection

placeholder%20prop
placeholder%20prop474×523 33.6 KB

5

I’m not using the value for anything that needs an int so I am just using queries like the one below and then binding to the value since both the value and label have the same data. Do you see any issues with this? I haven’t had any problems yet and it sure makes things more simple.
SELECT DISTINCT
[colName] AS ‘value’,
[colName] AS ‘label’
FROM [tableName]

6

There is nothing wrong with what you’re doing. Original attempts at getting the selected “label” value were in instances where the label is NOT the same as the value.

For example: I have a table which stores the amount of beverages of various types in the break room. I use the following query to populate my Dropdown component.

select quantity as 'value', name as 'label' from beverages;

I use this query because I need to know the count of that type of beverage, but I ALSO want to know what the Label is, because I want to display an image for that brand.
A query of

Select name as 'value', name as 'label' from beverages;

Only lets me select and use the name, which means I then have to run another query to get the quantity Im looking for.