1. Home
  2. Forum
  3. Blazor
  4. Menu item doesn't expand on click

Menu item doesn't expand on click

My treeview menu works except that to expand an item I have to click on the arrow. I would like it to also expand when I click on the item itself, Below are the treeview CSS overrides that I'm using for various things. What do I need to add to make a click on an item expand the node?

.e-treeview {
    background-color: #333e53;
}

    .e-treeview .e-list-text {
        color: #E4E4E7;
    }

    .e-treeview .e-list-item.e-hover > .e-text-content .e-list-text {
        color: #ffffff;
    }

    .e-treeview .e-list-item.e-hover > .e-text-content {
        background-color: #404055;
    }

    .e-treeview .e-list-item.e-active > .e-text-content {
        background-color: #6414db;
    }

    .e-treeview .e-list-item.e-active > .e-fullrow {
        background-color: inherit;
        border: none;
    }

    .e-treeview .e-list-item.e-active.e-hover > .e-text-content .e-list-text, .e-fullrow {
        color: #ffffff;
        border: none;
        background-color: inherit !important;
    }

    .e-treeview .e-list-item.e-active > .e-text-content .e-list-text {
        color: #ffffff;
    }

    .e-treeview .e-list-item.e-active,
    .e-treeview .e-list-item.e-hover {
        background-color: #333e53;
    }

    .e-treeview .e-level-1,
    .e-treeview .e-level-2,
    .e-treeview .e-level-3 {
        background-color: #333e53;
    }

    .e-treeview .e-list-item.e-hover > .e-fullrow {
        background-color: inherit;
        border: none;
    }


3 Replies 1 reply marked as answer
SP Sowmiya Padmanaban Syncfusion Team April 21, 2021 11:45 AM UTC

Hi Andy Richard,  
 
Greetings from Syncfusion support. 
 
We have checked your requirement with TreeView component. When setting the ExpandOn property of TreeView component as Click, it expands the corresponding node on clicking. 
 
Please, refer the below code snippet. 
 
@using Syncfusion.Blazor.Navigations 
<SfTreeView TValue="MailItem" ExpandOn="ExpandAction.Click"> 
    <TreeViewFieldsSettings TValue="MailItem" Id="Id" DataSource="@MyFolder" Text="FolderName" ParentID="ParentId" HasChildren="HasSubFolders" Expanded="Expanded"></TreeViewFieldsSettings> 
</SfTreeView> 
 
 
Please, refer to the below link for TreeView component. 
 
  
 
 
Please let us know, if you need any further assistance. 
 
Regards, 
Sowmiya.P 


Marked as answer
AR Andy Richard April 21, 2021 01:43 PM UTC

That works. Thank you.

SP Sowmiya Padmanaban Syncfusion Team April 22, 2021 05:34 AM UTC

Hi Andy Richard,  
  
We are happy to hear that your problem has been resolved. Please contact us, if you need any help from us. 
  
  
Regards, 
Sowmiya.P 


Loader.
Up arrow icon