mdb-autocomplete

Topic: mdb-autocomplete

gobrien@bluelineinnovations.com pro asked 7 years ago

Hi, I am successfully using the mdb-autocomplete component. The data list displays correctly when I start typing in the field. But, if I enter data that is not in the list and I tab to another field on my form then the autocomplete list does not disappear. It stays displayed and the only way to get rid of it is to make a selection in the list.I need to be able to allow the user to enter a value that is not in the list. My application automatically adds new data values to the DB so that they appear in the list next time.I have a jQuery function that does an AJAX DB query when the autocomplete input looses focus. Ideally I would like to invoke a hide method on the mdb-autocomplete component at that time.

Add comment

gobrien@bluelineinnovations.com pro answered 7 years ago

0 0 Best answer

Note, the problem only occurs if the data I type into the mdb-autocomplete is not in the list. For example, if the list contains "NH1234" and "NH5678" and I type "NH3456" then when the mdb-autocomplete input loses focus the list is still displayed and will not disappear until I actual enter something from the list or clear the field.

gobrien@bluelineinnovations.com pro commented 7 years ago

I added the following to autocomplete.js: // The following will close the autocomplete list when the input loses focus. This will allow // the user to enter a value that is not in the list $('.mdb-autocomplete').on('focusout', function() { $autocomplete.empty(); }); This will allow a user to enter data that partially matches items in the autocomplete list and the list will disappear when the autocomplete input loses focus. Perhaps you will want to add this to a future revision.

Add comment

Edyta Dabrowska answered 7 years ago