pappu_kutty pappu_kutty - 6 months ago 44
jQuery Question

Get the selected value in jquery autocomplete on blur function

I want to have auto complete functionality, where the text-box should get populated with the value list as a first item when there is an blur event.

I would like to have the functionality same as implemented in this link link

enter image description here

I have the code below, which populates on tab and enter key, but dont know how to achieve same functionality on blur event.

$( "#statelist" ).autocomplete({
autoFocus: true,
source: states,
select: function (event, ui) {
stateid = (ui.item.lable);
$("#stateid").val(stateid);
}
});


EDIT :-
user enters a text lets us say type "che" and without pressing tab or enter key, user moves his control to next textbox, in this scenario I want the first list item to populated automatically in the textbox.

Answer

You can send a enter key on blur event.

     $( "#statelist" ).blur(function(){
         var keyEvent = $.Event("keydown");
         keyEvent.keyCode = $.ui.keyCode.ENTER;
         $(this).trigger(keyEvent);
     }).autocomplete({
         autoFocus: true,
         source: states,
         // ...
     });

Here is the fiddle: http://jsfiddle.net/trSdL/4/

And here is a similar question. http://stackoverflow.com/a/15466735/1670643