Prevent tooltip suggestions on input field

Learn
1

Hi,

I am using this package GitHub - PaackEng/elm-ui-dropdown: Dropdown module for Elm UI which is fine for my needs, apart from a tooltip list of suggestions that keeps popping up below the text field.

The tooltip list gets in the way of keyboard navigation, and isn’t necessary for my use case.

I’ve forked the package to make some changes as the original package was archived last year, but before I continue with it, I need to prevent this pesky popup from appearing all the time. I’ve tried to fix this myself, but now I’m stumped.

You can see it here:

Screenshot 2024-09-27 at 20.59.27
Screenshot 2024-09-27 at 20.59.27402×604 11.3 KB

Is there an attribute I can set on the text input field to prevent this from appearing?

Thanks

2

I’ve fixed it by removing the id attribute, but would be grateful to anyone that could spare the time to explain what was going on :slight_smile: my HTML knowledge isn’t what it should be :roll_eyes:

edit: the id attribute ended “-search”, so I’m assuming it has something to do with this, so I’ll look into it further tomorrow.

3

You can prevent the popup by setting an autocomplete="off" attribute on the input element. Reference: HTML attribute: autocomplete - HTML: HyperText Markup Language | MDN

You can also provide your own list for the popup using a datalist as described here <datalist>: The HTML Data List element - HTML: HyperText Markup Language | MDN

2 Likes
4

Thanks, I thought I’d tried autocomplete="off", maybe I had autocomplete="false", not sure now, but thanks for the info, much appreciated.