Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Prevent clicking dropdown item from closing the menu #5487

Open
InzeNL opened this issue May 3, 2024 · 1 comment
Open

Prevent clicking dropdown item from closing the menu #5487

InzeNL opened this issue May 3, 2024 · 1 comment
Labels
Status: Investigate Needs to investigate more to what can be done. Type: Feature ⚙ Request or idea for a new feature.
Milestone

Comments

@InzeNL
Copy link
Contributor

InzeNL commented May 3, 2024

Is your feature request related to a problem? Please describe.
In my dropdown, I want to add two " buttons". One that enables all checkboxes in the dropdown, and one that disables all of them. I have working code behind this, and it toggles the checkboxes. However, when these dropdown items are clicked, the dropdown menu is closed.

Currently, this is an implementation for a dropdown menu with items with and without checkboxes. When the item with the checkbox is clicked (anywhere), the dropdown menu stays open. When the dropdown item without the checkbox is clicked, the dropdown menu closes.

<Dropdown>
    <DropdownToggle>
        Dropdown Toggle
    </DropdownToggle>
    <DropdownMenu>
        <DropdownItem ShowCheckbox="true">Dropdown Item With Checkbox</DropdownItem>
        <DropdownItem>Dropdown Item Without Checkbox</DropdownItem>
    </DropdownMenu>
</Dropdown>

Describe the solution you'd like
I would like to see a parameter I could add to the dropdown item that disables "close on click"

With the code above, the updated could look like this.

<Dropdown>
    <DropdownToggle>
        Dropdown Toggle
    </DropdownToggle>
    <DropdownMenu>
        <DropdownItem ShowCheckbox="true">Dropdown Item With Checkbox</DropdownItem>
        @* Added a parameter here *@
        <DropdownItem CloseOnClick="false">Dropdown Item Without Checkbox</DropdownItem>
    </DropdownMenu>
</Dropdown>

Perhaps, this same parameter can also be used to enable "close on click" for dropdown items with checkboxes. I don't know the use case for this, but it might end up being useful

Current workaround:
I have currently added this workaround, that simply reopens the dropdown when the dropdown item is clicked.

<Dropdown @ref="dropdown">
    <DropdownToggle>
        Dropdown Toggle
    </DropdownToggle>
    <DropdownMenu>
        <DropdownItem ShowCheckbox="true">Dropdown Item With Checkbox</DropdownItem>
        <DropdownItem Clicked="async () => await dropdown.Show().ConfigureAwait(false)">Dropdown Item Without Checkbox</DropdownItem>
    </DropdownMenu>
</Dropdown>

@code{
    private Dropdown? dropdown;
}

Additional context

The workaround does seem to work fine, even if it isn't the most elegant option. Therefore, this feature request doesn't have a high priority

@InzeNL InzeNL added the Type: Feature ⚙ Request or idea for a new feature. label May 3, 2024
@stsrki
Copy link
Collaborator

stsrki commented May 3, 2024

I'm not sure if making the menu open after it is clicked makes sense. From a UX perspective.


We will investigate and make a decision. In theory, it should be an easy addition.

@stsrki stsrki added this to the Backlog milestone May 3, 2024
@stsrki stsrki added the Status: Investigate Needs to investigate more to what can be done. label May 3, 2024
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Status: Investigate Needs to investigate more to what can be done. Type: Feature ⚙ Request or idea for a new feature.
Projects
None yet
Development

No branches or pull requests

2 participants