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
dchen71 free answered 4 years ago
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 4 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
Watts free answered 4 years ago
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 :)
Tomek Makowski staff answered 4 years ago
Check this out
https://mdbootstrap.com/snippets/jquery/tomekmakowski/2048236?view=project#js-tab-view
Is this solution meets your expectations?
Regards.
FREE CONSULTATION
Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.
Answered
- ForumUser: Free
- Premium support: No
- Technology: MDB jQuery
- MDB Version: 4.17.0
- Device: Desktop
- Browser: Chrome
- OS: Linux
- Provided sample code: No
- Provided link: Yes