The OP's dropdown was structured like this:
[
{
"value": 0,
"label": "Option 0"
},
{
"value": 1,
"label": "Option 1"
},
...
]
Selecting the second option from the dropdown would return value : 1.
The OP wanted to return the label for that option and thought that the way to that would be to treat the value as an pointer into the options list and then retrieve the label at that position. I provided a much simpler solution.
To make it work the way the OP was trying:
Create an expression structure1 and to collect the index pointer (the dropdown's value) and the dropdown options array.
Now the structure is passed to the Expression Transform as {value} which will look like
{
"index": 2, "options",
"options" : [{"value": 0, "label": "Option 0"}, {"value": 1, "label": "Option 1"}, ...]
}
Now if index = 1 the expression I supplied will evaluate as
{value}['options'][1]['label']
As explained, there's a much simpler way.
1 Note that it's and Expression Structure and not a simple Expression.
1 Like
Thanks, I had mine structured the same way, with index and options just like you have shown. It didn't work though, it didn't like index (it liked selectedIndex but it didn't change with my selection).
Instead I Just added a transform and made the value an object with both value/label and it worked. I think that was the recomneded way and seemed much easier.
Thanks!
Why though? If you set each option's value to the value you'll need after selection it will show up in the value property and that can be referenced directly by any script or binding that needs it without a transform.
The value for me is an ID, I need to use to for historian query tags. So for me having the label be the name and the value be an integer was required. But, I wanted the label for exporting the data to excel so I could name the file on what was selected.
1 Like
I think he meant he used a transform to generate the list of objects, containing both the label and the value.
Which is the simplest and sanest way to do this, so good for him if I understood correctly.
1 Like
Very useful way, thanks for the support
@Transistor, your expression structure works perfectly when the value in the options is the same of the index, but in the case I'm woking on I have this options for example
[
{
"label": "Option 0",
"value": 110
},
{
"label": "Option 1",
"value": 13
}
]
How could I manage it using the expression structure?
You can add extra information into each option dictionary.
[
{
"value": 0,
"label": "Option 0",
"returnValue": 110
},
{
"value": 1,
"label": "Option 1",
"returnValue": 13
}
]
Now the value will contain the array index (which you don't want) so create a custom property returnValue on the dropdown, add an expression binding
try(
{this.props.options}[{this.props.value}]['returnValue'],
null
)
and use custom.returnValue where you might have previously used value.
The try(..., null) just prevents an error when nothing has been selected.
I'd keep the value for the actual value and add an index property instead.
But what is all this for ? Why not just make value an object and add all that's needed here ?
