What I want to achieve:
I have a text box that uses jquery ui autocomplete function, and what I want to achieve is when an option is clicked on and selected from the autocomplete dropdown I want an event to be triggered.
The problem
The problem I'm having is, I tried to use .change() which works however this only triggers when you click off the element. (This problem has been asked before in this post Why does jQuery.change() only trigger when I leave the element?).
However the solutions in that thread are of no use to me in this situation. As I want the event to be triggered when the element from the drop down is selected and loaded into the text box. I don't want to have to click out of the text box to trigger the .change() event.
The ideal outcome:
When the user selects an option from the autocomplete list it then triggers the event without the user having to click away from the text box.
The event in question I want to occur is the autocomplete text box is hidden once the user selects an option:
$(search_box).change( function () {
$(search_box).hide();
} );
This works but as i've mentioned above the user has to click away for the change event to trigger. Is there any work around to this?