jQuery-Autocomplete icon indicating copy to clipboard operation
jQuery-Autocomplete copied to clipboard

Suggestions going off the viewport issue

Open engmat opened this issue 4 years ago • 1 comments

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?

engmat avatar Jan 22 '21 10:01 engmat

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

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

Channel80 avatar May 27 '22 16:05 Channel80