How to fix autocomplete on textbox in jQuery?

I using jquery.autocomplete.js for autocomplete textbox.

I getting all the location record on keypress event.

keypress event I passed the text value of the location textbox.

for eq. I writing text "Lo" then it get all records starting with "Lo" every time I get new suggestion from SQL database.

My problem is that. I seen two, three or more list box as suggestion under the textbox.. I write .unautocomplete() method for remove previous suggestion list in each keypress event. How to fix previous unautocomplte list from textbox..

In my autocomplete I see autocomplete suggestion list shown more than one suggestion list.. how to fix this..

Below I wrote my code.

<asp:TextBox runat="server" class="location" ID="txtLocation" > </asp:TextBox>

<script>
$('#<%= txtLocation.ClientID %>').onkeypress(function () {
  if ($('#<%= txtLocation.ClientID %>').val().length >= 1) {
    GetCitiesLikeList($('#<%= txtLocation.ClientID %>').val());
  }
});

function GetCitiesLikeList(objcity) {
    if (objcity != null && objcity != "") {        
         $.ajax({
            type: "POST",
            url: "http://www.myweburl.com/webservices.asmx/GetCitiesLikeList",
            data: "{ City : '" + objcity + "'}",
            contentType: "application/json; charset=utf-8",
            dataType: "json",
            success: function(msg) { 
                if (msg.d != null && msg.d != "") {            
                    cities = msg.d.split(",");                    
                    $(".location").autocomplete(cities, {
                        matchContains: true,
                        minChars: 0
                    });
                }
                else
                 $(".location").unautocomplete();
            },
            error: function(xhr, ajaxOptions, thr开发者_运维知识库ownError) {return false;}
        });
    }
    else
        $(".location").unautocomplete();
}
</script>

look into this image what is problem is going in my autocompleter suggestion list.

Give me solution for this.

You don't need to use standalone Autocomplete plugin as it is now part of jQueryUI.

I'm not sure if I'm getting what you're saying 100% correctly, but just a few things:

1. You don't need to manually wait for the keypress event for jQuery UI autocomplete. It already does that for you when you call .autocomplete() on an element.
2. Autocomplete also has functionality to handle the item population using AJAX you're doing here.

So my guess for why you're getting double the lists is because you're technically doing what autocomplete does for you again (manually).