Limit the number of selections

[cbroome]

Its possible to switch the react-dropdown-tree-select between multi select and single select through a simple prop, but is there a preferred way to limit the number of options a user can select? I didn't see an example listed.

Thanks

[mrchief]

Great question! So single select is slam dunk - it's 1

For multi select, you can do that with an HOC - something that keeps track of the limit and listens for onChange. Once the limit is reached, you set readonly=true and the dropdown becomes readonly.

This might not have the desired UX effect if you have the search dropdown open and want to limit in that flow as a re-render will recreate the component and so keeping the same UX state (dropdown open, desired selections set) might get tricky. In that case building something within the component might be desirable.

I'd suggest try the HoC to see if it meets your need and if not, we start thinking about building some native feature.

[cbroome]

Thanks for responding. In the readonly scenario would that also remove the ability to "deselect" options as well? Would the onClick handlers still capture the selected items?

[mrchief]

Unfortunately readonly makes it completely readonly so no - you can't deselect. I guess we're looking at a native solution as the only option then. Would you be interested in working on this?