search

devbridge / jQuery-Autocomplete

Ajax Autocomplete for jQuery allows you to easily create autocomplete/autosuggest boxes for text input fields
https://www.devbridge.com/sourcery/components/jquery-autocomplete/
Other
3.57k stars 1.67k forks source link

Suggestions going off the viewport issue #815

Open engmat opened 3 years ago

engmat commented 3 years ago

Hello.

I've encountered an issue with autocomplete inputs that are near the edge of a screen with values that are fairly long. If you use "flex" to show the entire label, it goes off the screen and requires the user to scroll.

Example (the blue on the right of the screenshot is my code editor): image

I've looked through the documentation and took a peek through the code, but there doesn't seem to be a way to tell the input to make the box work from the right position of the input instead of the left.

Whilst I could make it so the suggestions are only as long as the input through a specific width or via 'auto', I do have a few cases where I need the label to at least be fully visible. The closest I could get was to use "beforeRender" to set the left and right positioning styles directly but the code overwrites the "left" position with it's defaults when it's constructed and made visible (confirmed with messing around with the developers console).

Is there anything else I can do to make the align from the right or be prevented from going off the view that I'm missing, or is this something that can't be done?

Channel80 commented 2 years ago

I fixed it for me with an additional style for ui-menu or ui-autocomplete like

.ui-menu { width: 50vh !important; }