Do we have multi selection facility in vision dropdown component like we have in perspective?
Sorry! off topic.
No. Vision’s dropdowns are ultimately Java Swing JComboBoxes ‘under the hood’, and the entire component model assumes single selection.
Can you please suggest what we can use for multi selection dropdown
It seems like it would be relatively easy to give a jtable the appearance of a dropdown with all of the same functionality plus multiselection.
really don't know what it is. I haven't tried Jtable, need to know JAVA also for Ignition.
Is there any option
Unfortunately, I'm not where I can draw anything up right now, but if nobody comes up with a better solution, I'll do it later in the day. Both the dropdown, and the basic table use a dataset to store data, so the table could easily hold the same [label, value] data as a dropdown. Position a small square button next to a text field with the same arrow icons, and script the visibility of the table. This would probably be best if it were designed as a template.
It's possible somebody has already done something like this. Have you checked the ignition exchange?
1 Like
I found the time to cobble a template example together. Here is a side by side comparison with the multiSelect dropdown on the left and the standard dropdown on the right:
The selected indexes, values, and labels are stored in the template's properties as datasets:
Below is the template itself. Feel free to download it, import it, and continue development on it until it suits your needs:
multiSelectButton.zip (10.1 KB)
5 Likes
It's been a while, but there is now a legit multiselect dropdown available for download at the exchange:
Multiselect Dropdown Exchange Resource: Version 1.0
Multiple selections can be made in the normal way with the ctrl or shift keys:
It is also possible to arrow up or down and use the enter key to select or deselect items:
The dropdown also filters possible selections as the user types making it easy to locate specific selections in long lists:
The dropdown also features a table mode:
Here are the results:
8 Likes
Hey, ive installed the new package from gateway, was wondering where the new dropdown appears? I can't seem to find it.
If you mean you've downloaded and imported the exchange resource, then it will be in the project browser under Vision Templates.
Hi, thank you so much for that, another question, I am trying to use the new function Multi-Select dropdown to display different values in my power table based on the selections in the dropdown. The problem is I cannot directly access a dataset object (selectedLabels) in my Power table SQL query. How can i do this?
Hi, it's really good to use, thanks. As you know for a normal dropdown we can set -1 to selected value to clear selection, how can I do to reset the Multi Select Dropdown?
The multiselect dropdown equivalent of selectedValue is selectedValues, which is a list dataset datatype instead of an integer datatype. Simply provide selectedValues with an empty list to clear the selection.
Example:
# Clear current selections using a component in the same container as the dropdown
event.source.parent.getComponent('MultiSelectDropdown').selectedValues = []
Any time the selectedData, selectedIndexes, selectedLabels, selectedStringValues, or selectedValues properties are written to, the other properties will automatically update with the data that corresponds to the property that was changed, so writing a blank list to any of these properties will effectively clear the selections.
Thank you, it works. 
1 Like
@justinedwards.jle I found a bug with this when the Data is using two String columns.
in the "textFilter" custom method "setSelectedValues".
else selectedIndex
"selectedIndex" does not exist. I assume it needed to be "index" referencing the current index in the for loop.
1 Like
Is it possible to change the hover background color?
I've changed the "colorSelectionBG" color to match the Ignition dropdown default, but I can't figure out where the hover over color comes from.
Also wondering if its possible to change the "no selection" font color to be darker.
I would like to keep the lighter color if I could get the default Ignition dropdown to match, but not sure how to do that. I tried a style binding but it didn't quite behave how I wanted (lighter color only for text when not selected, but standard darker grey when the dropdown list opens).
Not a bad idea. I simply made it a shade lighter than the selected background color, so selecting red will result in light red hover color, blue selected color creates a light blue hover color, etc.
To change this, simply add a custom property to store the color, and edit the text filter's showDropdown custom method to use this color property instead of the brighter color.
Example:
Change this code:
# If the row is NOT selected, but the mouse cursor IS hovering over the row,
# ...Set the forground to the selection forground, but brighten the background color to give mouse cursor presence indication
# ...If the background color cannot be brightenened (any color with 255 for its defining values); then, darken the color instead
elif row == textFilter.hoverIndex:
background = multiSelectDropdown.colorSelectionBG.brighter()
foreground = multiSelectDropdown.colorSelectionFG
# If the attempt to brighten the background color with the brighter method has resulted in a color that hasn't changed,
# ...darken the background color instead
if background == multiSelectDropdown.colorSelectionBG:
background = multiSelectDropdown.colorSelectionBG.darker()
To this:
elif row == textFilter.hoverIndex:
background = multiSelectDropdown.colorMouseHover
foreground = multiSelectDropdown.colorSelectionFG
Result:
This text is actually rendered by a second text field that is an underlay to the user input text field:
...and the reason why it is so light in color is because it is disabled. I imagine you could simply enable it, and bind its color to another custom property. The only thing I would worry about is focus control, but if I recall correctly, I already have focus handling nailed down with the focusGained event handlers, so if the dropdown button or the underlay text field receive focus from a traversal forward cause, they will automatically pass that focus onto the next focusable component in the window they've been placed in, but it's been quite a while since I tested this, so I'm not confident enabling the second text field and binding its color to a custom property will work reliably in that regard.
Thanks very much for the detailed response!
I think on hindsight I do actually like the idea of the lighter tone for highlight vs selected. But I appreciate knowing where to tweak it if needed.
Ah must have glazed over the disabled property of that "selectionText" component. I was clicking around on it. Might just enable it but leave editable as false.
Thanks! Great component by the way, tried to do something similar myself but this blows it out of the water 
1 Like