How to create Editable Dropdown List with Dictionary Option using JavaScript?

Eg:-- When I type "A" all the elements starting with A should be displayed... If "B" then elements with B....etc)

Ex:

    <asp:DropDownList ID="ddlLocation" style="width:140px" runat="server">

    <asp:ListItem Value="1" >India</asp:ListItem>
    <asp:ListItem Value="2" >India - Hyderabad</asp:ListItem>
    <asp:ListItem Value="3">South Africa</asp:ListItem>
    <asp:ListItem Value="4">Australia</asp:ListItem>       

    </asp:DropDownList>

javascript :

function DisplayText()
{
 var textboxId = '<% = txtText.ClientID %>'; 
    var dropdownListId = '<% = ddlL开发者_JS百科ocation.ClientID %>'; 
    document.getElementById(textboxId).value = document.getElementById(dropdownListId).value; 
    document.getElementById(textboxId).focus(); 
}

code behind :

ddlLocation.Attributes.Add("onChange", "DisplayText();");

Regards ravi,

---

You may want to use jQuery autocomplete or ExtJs ComboBox