multiselect-react-dropdown icon indicating copy to clipboard operation
multiselect-react-dropdown copied to clipboard

Unable to open the dropdown list when clicking on the placeholder if singleSelect is set to true.

Open PrathameshSurve opened this issue 1 year ago • 1 comments

PrathameshSurve avatar Aug 27 '24 05:08 PrathameshSurve

I was having the same issue and this seems to be related with the search box input: https://github.com/srigar/multiselect-react-dropdown/blob/v2.0.25/src/multiselect/multiselect.component.tsx#L572. As you can see there the searchbox is always present, but when singleSelect is true it will be set always with the disabled attribute. As the search box input takes most of the space, if you click on it being disabled will result in no behavior.

My workaround was to remove the search box input programatically:

// Add id="msParent" to the parent div of the ReactMultiselect.
const msParent = document.getElementById('msParent');
const searchBox = msParent.getElementsByClassName('searchBox')[0];
searchBox.remove();

Make sure to do this on both mount and update methods.

PD: I tried removing the "disabled" attribute and adding "readonly" but the rendering behavior didn't work properly.

sebastian-aranda avatar Jan 07 '25 20:01 sebastian-aranda