Searchable Dropdown

Question

In the below code there is a dropdown which has countries and my aim is to make the dropdown to be editable and searchable.Please help me to do this.

code:

<label for='SelectCountry'>Choose a country:</label><br /><br />

    <asp:DropDownList id='SelectCountry' name='SelectCountry' runat='server'
                      ClientIDMode='Static'>
        <asp:ListItem Text='Afghanistan' Value='Afghanistan'></asp:ListItem>
        <asp:ListItem Text='Albania' Value='Albania'></asp:ListItem>
        <asp:ListItem Text='Algeria' Value='Algeria'></asp:ListItem>
        <asp:ListItem Text='Bahrain' Value='Bahrain'></asp:ListItem>
        <asp:ListItem Text='Bangladesh' Value='Bangladesh'></asp:ListItem>
        <asp:ListItem Text='Barbados' Value='Barbados'></asp:ListItem>
        <asp:ListItem Text='Cambodia' Value='Cambodia'></asp:ListItem>
        <asp:ListItem Text='Cameroon' Value='Cameroon'></asp:ListItem>
        <asp:ListItem Text='Canada' Value='Canada'></asp:ListItem>
    </asp:DropDownList>

    <br/>

    <script type='text/javascript' >
        $(function () {
            $('#SelectCountry').ufd({ log: true });
        });    
    </script>

</asp:Content>

Answer 1

Select2 is a jquery plugin that gives facilities like searching and displaying image, just check this link: Select2 - DropDown

Answer 2

You can use chosen jquery.

Here is the link