Unplanned
Last Updated: 02 Apr 2025 08:03 by Travis
Created by: Travis
Comments: 0
Category: DropDownButton
Type: Feature Request
1

Currently the DropDownButton only allows a single level of button items inside it. I need to put nested (child) levels of items, similar to the ContextMenu.

===

TELERIK EDIT:

A possible workaround is to use a Menu component with a single root item. Make that root item look like a Button with CSS:

<TelerikMenu Data="@MenuItems"
             Class="menu-button"
             TItem="@MenuItem"
             OnClick="@OnMenuItemClick">
</TelerikMenu>

<style>
    .menu-button {
        display: inline-block;
        color: var(--kendo-color-on-base);
    }

        .menu-button > .k-item {
            background: var(--kendo-color-base);
            color: var(--kendo-color-on-base);
            border: 1px solid var(--kendo-color-border);
            border-radius: var(--kendo-border-radius-md);
        }

            .menu-button > .k-item:hover {
                background: var(--kendo-color-base-hover);
            }

            .menu-button > .k-item.k-menu-item:active {
                color: var(--kendo-color-on-base);
                background: var(--kendo-color-base-active);
            }

            .menu-button > .k-item.k-menu-item:focus {
                box-shadow: 0 0 0 2px rgba(0,0,0,.08);
            }

            /* optional: hide the expand arrow */
            .menu-button > .k-item .k-menu-expand-arrow {
                /*display: none;*/
            }

            .menu-button > .k-item > .k-menu-link {
                padding: var(--kendo-spacing-1) var(--kendo-spacing-2);
            }
</style>

@code {
    private void OnMenuItemClick(MenuItem clickedItem)
    {
        Console.WriteLine($"The user clicked on {clickedItem.Text}");
    }

    private List<MenuItem> MenuItems { get; set; } = new List<MenuItem>()
    {
        new MenuItem()
        {
            Id = 1,
            Text = "Menu as DropDownButton"
        },
        new MenuItem()
        {
            Id = 2,
            ParentId = 1,
            Text = "Level 1 Child 1"
        },
        new MenuItem()
        {
            Id = 3,
            ParentId = 1,
            Text = "Level 1 Child 2"
        },
        new MenuItem()
        {
            Id = 4,
            ParentId = 3,
            Text = "Level 2 Child 1"
        },
        new MenuItem()
        {
            Id = 5,
            ParentId = 3,
            Text = "Level 2 Child 2"
        },
        new MenuItem()
        {
            Id = 6,
            ParentId = 5,
            Text = "Level 3 Child 1"
        },
        new MenuItem()
        {
            Id = 7,
            ParentId = 1,
            Text = "Level 1 Child 3"
        }
    };

    public class MenuItem
    {
        public int Id { get; set; }
        public int? ParentId { get; set; }
        public string Text { get; set; } = string.Empty;
    }
}

 

Unplanned
Last Updated: 11 Mar 2025 12:41 by Jason
Created by: Jason
Comments: 0
Category: DropDownButton
Type: Bug Report
1

When using the OnClick event on a DropDownButtonItem, the MouseEventArgs parameter is always null. However, if the OnClick event is used on the main TelerikDropDownButton component, the MouseEventArgs works correctly.

REPL reproduction - https://blazorrepl.telerik.com/mfYdbbPQ37jhZlMq47

Unplanned
Last Updated: 10 Jan 2025 15:03 by Aswin
Created by: Aswin
Comments: 0
Category: DropDownButton
Type: Feature Request
1
I want to update the popup items upon clicking on one of the options. I will need to first cancel the closing to keep the popup open in this case but I also need an option to refresh the popup without closing it.
Unplanned
Last Updated: 02 Aug 2024 07:23 by Lin
Created by: Lin
Comments: 0
Category: DropDownButton
Type: Feature Request
2

By default, the dropdown popup is automatically positioned 100% from the top and along the left side of its parent (the input). I want to customize this behavior, for example, aligned to the right side of its parent.

For the time being, a possible custom approach is to use a TextBox or Button component as an anchor and a configured Popup component. For example, refer to this REPL link.

 

Unplanned
Last Updated: 01 May 2024 11:53 by ADMIN
Created by: Juwon
Comments: 2
Category: DropDownButton
Type: Feature Request
4

I want to track when the popup element of the DropDownButton is opened and closed.

===

ADMIN EDIT

===

For the time being, a possible option is to use the DropDownList component that exposes such events. Customize it so it can look and behave similarly to the DropDownButton.

Example implementation: https://blazorrepl.telerik.com/mekbkTPE21kwyMBU05.