Reputation: 83143
I'm using a ColdFusion autosuggest for my UserID field. When a user starts to type in a UserID, a list of user ids pops up (populated by a cfc function). Sample code:
<cfinput name="userID" type="text" value="#userID#" autoSuggest="cfc:Utilities.suggestUser({cfautosuggestvalue})" matchcontains="true" />
I want to fire a handler when I choose one of the values in the autosuggest, so that I can use the selected value elsewhere. JQuery code:
$('#userID').change(function(){
var userID = $(this).val();
$('#otherUserIDField').html(userID);
});
The problem is, when I click on an item in the autosuggest list, the change event is fired before the selected entry is injected into the form field. For example, if I'm looking for user "123456" and I start typing "123" and then see it in the autosuggest list, I click on "123456" in the autosuggest list and the change event is fired, while the value of the form field is still only "123". I have tried adding a delay ($('#otherUserIDField').delay(1000).html(userID);
), but it didn't help. Is there any other event I can use? Is there any way around this?
How can I execute code only after an autosuggestion was picked?
Upvotes: 0
Views: 226
Reputation: 1575
Personally I would use jQuery stand alone rather then the inbuilt ColdFusion ajax. Here is a good example of this in action with a working demo: http://jacktraynor.blogspot.com.au/2012/02/jquery-autocomplete-using-coldfusion.html
Upvotes: 1
Reputation: 83143
I ended up using the setTimeout
method. As @Esailija mentioned in a comment, the delay
function doesn't actually delay the html call. I couldn't use "this" with the new code as the delay causes the focus to no longer be on the textbox.
$('#userID').change(function(){
setTimeout(function(){
$('#otherUserIDField').html($('#userID').val());
}, 1000);
});
Upvotes: 1