Following on from my previous two questions:
How to make jQuery autocomplete execute a search() when user hits submit
How would I trim the input to a JQuery auto-complete box?
I have a jQuery UI 1.8 autocomplete box in my form, and for the most part it works like a charm. The one problem I have is that if I enter a valid name, but do not select the choice that appears, then the name is never matched against my {name,value}
list and so the correct value for the hidden input that contains the 'value' part is not set. This of course causes the confusing situation where one can enter a name you know is correct, hit submit and be told you haven't entered a correct name (as the value is null
).
How can I make sure that the hidden input value is set even if the user doesn't make a choice from the autocomplete box? Is there some function I can tie to the onclick event of the submit button which would make jQuery do a search with what is in the box and automatically select the first option? Alternatively, can I make it so that开发者_运维问答 the autocomplete will select the first option when the user deselects the input box in any way (return/tab/click off/etc)?
Thanks.
Here is my solution to your problem. I just added the part regarding the change event. I hope it helps.
jQuery(function(){
jQuery('#Resource').autocomplete({
source: data,
focus: function(event, ui) {
jQuery('#Resource').val(ui.item.label);
return false;
},
select: function(event, ui) {
jQuery('#Resource').val(ui.item.label);
jQuery('#EmployeeNumber').val(ui.item.value);
return false;
},
change: function(event,ui){
for (var i in data){
if (data[i].label==jQuery('#Resource').val()){
jQuery('#EmployeeNumber').val(data[i].value);
}
}
}
});
});
精彩评论