shentao / vue-multiselect

Universal select/multiselect/tagging component for Vue.js
https://vue-multiselect.js.org/
MIT License
6.69k stars 988 forks source link

Options become invisible when rendered inside a parent with overflow scroll or hidden #1023

Open katranci opened 5 years ago

katranci commented 5 years ago

Reproduction Link

https://codesandbox.io/s/vuemultiselect-issue-txjr4

When vue-multiselect component is rendered inside a parent or ancestor element with overflow property set to scroll or hidden and when dropdown options are rendered above position then part of the options become invisible.

I've actually figured out where the problem is but haven't had a chance to prepare a pull-request. The problem is that vue-multiselect is making calculations based on the position of it on the screen (via getBoundingClientRect). Instead it should find the first ancestor with overflow property that is not visible and use that as reference.

gheithen commented 4 years ago

Have you made a fix for this issue, if so, can you please share?

skattabrain commented 4 years ago

Has a PR been opened for this? We are experiencing this as all.

jwkicklighter commented 4 years ago

Bump

dimsanchuk commented 1 year ago

Are there any updates here?