Autocomplete On Change Event

Topic: Autocomplete On Change Event

Watts free asked 4 years ago

Expected behavior

Retreiving $("#autocomplete").val() after "change" event on autocomplete input would display the selected value.

Actual behavior

The $("#autocomplete").val() only returns the key the user types and not the full selected string.

What event should be used to capture the selected value by either mouse or keyboard?

Resources (screenshots, code snippets etc.)

Type Tex, then use either the mouse click or keyboard to select Texas.

https://mdbootstrap.com/snippets/jquery/watts/2047221

Add comment

dchen71 free answered 3 years ago

0 0 Best answer

Please insert min. 20 characters.

I have something setup similar to the example above. I am unable to make the click event work in the mdb-autocomplete-wrap but I am trying to make it so it prints out statements whenever I click on the autocomplete elements in the autocomplete box.

My code is like so:

$('#form-autocomplete').mdbAutocomplete({
    data: response.data
})

$(".mdb-autocomplete-wrap").on("click", function() {
    console.log("wow")
})

I am only able to get the click event when I change the .mdb-autocomplete-wrap's css from min-height to height but that only works in the empty ul and not whenever any of the elements are clicked on. Am I missing something with this click event?

Krzysztof Wilk staff commented 3 years ago

Hi!

We know this problem and already have task for it. We'll try to fix it as soon as possible :)

Best regards

Rimark free commented 3 years ago

Any updates here? Still having this issue...

Marcin Luczak staff commented 3 years ago

Hi,

Unfortunately, I cannot tell when this will be fixed.

Keep coding, Marcin

Add comment

Watts free answered 4 years ago

0 0 Best answer

That's perfect, you guys give the best support! Love your work.

Can you explain why the timeout is required? I never would have got to that.

Krzysztof Wilk staff commented 4 years ago

Function with change event gets the value just before the autocomplete corrects it, so that's why you always get for example "Tex" instead of "Texas".

So we have to call this function after autocomplete, right? And setTimeOut does it perfectly. Then you'll get updated, corrects value :)

Add comment

Tomek Makowski staff answered 4 years ago