Add double click listeners to ListBoxComponent items

[Kenneth Tan]

I need to run a function that directly alters my component state that will run whenever the user double clicks an item inside the ListBox, and retrieve that item. Is there any way to do this?  

[Madhan Venkateshan]

Hi Kenneth, 

 

Thanks for contacting Syncfusion support. 

 

We would like to suggest you to use getDataByValue method to get the item of the ListBox on double clicking the ListBox. We have prepared a sample, please refer the below sample link and code snippets. 

 

Sample link: https://stackblitz.com/edit/react-ysjmr5?file=index.js 

 

Index.jsx 

componentDidMount() { 

  setTimeout(()=>{ 

     this.listboxObj.element.parentElement.addEventListener('dblclick', (args)=> { 

     var item = this.listboxObj.getDataByValue(args.target.getAttribute('data-value')); 

     console.log(item); 

    }) 

  }); 

} 

render() { 

        return (<div> 

                <ListBoxComponent dataSource={this.data} ref={(obj)=> {this.listboxObj = obj}}/> 

            </div>); 

    } 

 

 

Regards, 

Madhan V