Access to selected item in selected list box?

[Deleted user]

I saw this question in another issue, but didn't see the answer. If the user moves items to the selected listbox, then clicks one of those items, do we have a way to access that selected item? I need to know when the user clicks an option and perform an action based on that selection. Thanks.

[jakezatecky]

There is the selectedRef property you could use. This will give you access to the underlying HTML node for that <select> element with which you could access the selected items.

[Deleted user]

Thanks for your quick response. I'm new to React and still learning the basics. Is there a way to listen for the selection event?

[jakezatecky]

You can listen to the "change" event on the DOM node. Here is an example of how to do this:

class Widget extends Component {
    ...

    componentDidMount() {
        this.selectedElement.addEventListener('change', (event) => {
            console.log(event.target.value);
        });
    }

    render() {
        ...

        return <DualListBox ... selectedRef={(c) => { this.selectedElement = c; }} />;
    }
}

[Deleted user]

Thanks, that's exactly what I needed.

[jakezatecky]

Closing issue. Let me know if you have need further help.