How to Search an Element into a List Box using javascript in ASP.Net

Searching an Element into a List Box using JavaScript by Typing into TextBoxin Asp.Net:-


The Asp.Net ListBox is a server side control and there are no way to search Element into a list by typing the value into textbox, because the TextBox server control does not have any event to do this and the TextChanged event of TextBox is not working in this because when we trying this then it will reload the page and the selection of element into ListBox is gone again and it will come into previous state. So to do this we need to create a javascript function and call it onkeyup event of the TextBox and this will help you to select an element just typing the few first char into the textbox.

This is the Code for searching and selecting an element into ListBox by Typing TextBox.

<script type="text/javascript">
 function SearchList(obj,key,list)
    {    
    var tb="";
    tb+=obj.value;
    if(obj.value=="")
    {
        list.selectedIndex=-1;
    }
    else
    {
         for(var i=0;i<list.options.length;i++)
         {
             if(list.options[i].text.toLowerCase().substring(0,tb.length)==tb)
             {
                 list.options[i].selected=true;
                 if(key.keyCode==13)
                 {
                    obj.value=list.options[i].text;
                 }
                 return false;
             }
            else
            {
                list.selectedIndex=-1;
            }

        }
    }
    }  
</script>

call above function like this...

<asp:TextBox ID="text1" runat="server" onkeyUp="SearchList(this,event,document.getElementById('list1'))"></asp:TextBox>
<asp:ListBox ID="list1" runat="server"></asp:ListBox>

Tweet