Get the selected value in jquery autocomplete on blur function

Question

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

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 1

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. https://stackoverflow.com/a/15466735/1670643