Question

I have a text input that has autocomplete connected to a list of cities in a database. I was wondering how I could focusout once the user clicks something from the autocomplete. I’m using MVC 4, so it uses a function I created called Quicksearch to retrieve the list of cities that coincide with what the user typed.

HTML Code

@Html.TextBoxFor(x => x.CityName, new { @class="required", name="q", data_autocomplete = @Url.Action("QuickSearch", "Booking")})

Javascript

$(document).ready(function () {
    $(":input[data-autocomplete]").each(function () {
        $(this).autocomplete({ source: $(this).attr("data-autocomplete")});
    });
});

Thanks for your help

Answer 1

Use the select event, to attach code to blur the focus:

$(document).ready(function () {
    $(":input[data-autocomplete]").each(function () {
        $(this).autocomplete({ 
            source: $(this).attr("data-autocomplete"),
            select: function(event, ui) { 
                $(this).blur(); 
            }
        });
    });
});