We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy. Image for the cookie policy date

How to implement sub items with DropdownList

Hi Syncfusion Team, 
I'm using the DropdownList component and I want to implement sub-items (view image) on it.

Do you have a way to reach my requirement?
Thanks in advance for your help.
Best regards.

3 Replies

YA YuvanShankar Arunagiri Syncfusion Team March 14, 2023 09:29 AM UTC

Hi Ton,

We have checked your reported query and prepared the sample based on your requirement. Using the Dropdown List component, we can’t achieve your requirement like shown in your screenshot. But we can achieve your desired output in Dropdown Button component. kindly refer to the below code snippet and sample link.

UG link: https://ej2.syncfusion.com/react/documentation/drop-down-button/popup-items

Using the popup templating feature, we can set the Menu component within the Dropdown Button popup shown as below.

<DropDownButtonComponent content="Content" target='#target'></DropDownButtonComponent>


<div id="target">

                        <MenuComponent items={menuItems} orientation="Vertical"/>


Output screenshot:

Graphical user interface, application

Description automatically generated

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

Get back to us if you need any further assistance on this. 


YuvanShankar A

TT Ton That Hung March 20, 2023 04:10 AM UTC

Thanks for your support.

YA YuvanShankar Arunagiri Syncfusion Team March 20, 2023 06:03 AM UTC

You are welcome, Ton. Please get back to us if you need any further assistance on this.

If that post is helpful, please consider accepting it as the solution so that other members can locate it more quickly.

Live Chat Icon For mobile
Up arrow icon