Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 2 of 2
  1. #1
    New Coder
    Join Date
    Feb 2009
    Posts
    12
    Thanks
    2
    Thanked 0 Times in 0 Posts

    Smile Search Listbox data by Typing on Textbox

    Hi there,

    I have a textbox and listbox with data, I want to type in textbox and it should search/point values to listbox,

    I have written the same code in VB.net but unable to convert it into JavaScript. My code is as below , I can't use Ajax Listbox extender.

    Please help

    'Code in ASP-Java Script
    Function Search11()
    {
    sSearchString = document.forms[formName].elements[inputName].value.toUpperCase();
    iSearchTextLength = sSearchString.length;

    for (j=0; j < document.forms[formName].elements[selectName].options.length; j++)
    {
    sOptionText = document.forms[formName].elements[selectName].options[j].text;
    sOptionComp = sOptionText.substr(0, iSearchTextLength).toUpperCase();

    if(sSearchString == sOptionComp)
    {
    document.forms[formName].elements[selectName].selectedIndex = j;
    break;
    }
    }
    }
    ''**Code in VB.Net

    '* Button Click
    txtStreetNameAddress.Text = UCase(txtStreetNameAddress.Text)
    Dim sSearchString As String = txtStreetNameAddress.Text

    Dim iCounter As Integer
    For iCounter = 0 To lstStreetsAddress.Items.Count - 1

    Dim sListBoxValue As String = lstStreetsAddress.Items(iCounter).Value
    Dim sCompare As String = ""
    If sSearchString.Length <= sListBoxValue.Length Then
    sCompare = sListBoxValue.Substring(0, sSearchString.Length)
    End If

    If sCompare = txtStreetNameAddress.Text Then

    lstStreetsAddress.SelectedIndex = iCounter
    Exit For

    End If
    Next iCounter

    ''Calling Function
    Common.OuputText(txtStreetNameAddress, lstStreetsAddress)


    ************************************

  • #2
    Banned
    Join Date
    Mar 2009
    Posts
    248
    Thanks
    3
    Thanked 68 Times in 66 Posts
    Code:
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
    <html>
    <head>
    <title>None</title>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <script type="text/javascript">
    	
    	var smartOptions = [];
    	var allOptions = [];
    	var smartListName = "vipInfo";      // the name of the searched list;
    	var searchInputName = "vipSearch"   // the name of the text input used to search the smart list;
    
    	function collectOrigData(nList){
    
    		for (i=1; i<nList.length; i++)
    			{
    			 nList.selectedIndex = i;
    			 allOptions[i-1] = [nList.options[i].text,nList.value];
    			}
    		nList.selectedIndex = 0;		
    	}
    
    	function buildList(nForm,origData){
    
    		for (i=0; i<origData.length; i++)
    			{ 
    			 var nOption = document.createElement('option'); 
    			 nOption.value = origData[i][1]; 
    			 nOption.appendChild(document.createTextNode(origData[i][0])); 
    			 nForm[smartListName].appendChild(nOption); 
    			}
    	}
    
    	function buildSmartOptions(nForm){
    		
    		var matchStr = nForm[searchInputName].value.toLowerCase();
    		if (matchStr != "")
    			{
    			 smartOptions.length = 0;
    			 for (i=0; i<allOptions.length; i++)
    				{
    				 if (matchStr == allOptions[i][0].substring(0,matchStr.length).toLowerCase())
    					{
    					 smartOptions[smartOptions.length] = [allOptions[i][0],allOptions[i][1]];
    					}
    				}
    			nForm[smartListName].length = 1;
    			for (i=0; i<smartOptions.length; i++)
    				{
    			 	 buildList(nForm,smartOptions);
    				}
    			if (smartOptions.length > 5)
    				{
    				 nForm[smartListName].size = 6;
    				}
    			else 	{
    				 nForm[smartListName].size = smartOptions.length + 1;
    				}
    			}
    		if (matchStr == "")
    			{
    			 rebuildOrigList();
    			}
    	}
    		
    	function getChoice(nChoice){
    
    		if (nChoice != '')
    			{
    			 alert(nChoice)
    			}
    	}
    
    	function rebuildOrigList(){
    
    		var nForm = document.forms[0];
    		nForm[smartListName].options.length = 1;
    		buildList(nForm,allOptions);	
    		nForm[smartListName].size = 1;
    		nForm[smartListName].selectedIndex = 0;	
    	}
    
    	function init(){
    			
    		var nForm = document.forms[0];	
    		nForm[smartListName].onchange = function()
    			{
    			 getChoice(this.value);
    			}
    		nForm[searchInputName].focus();
    		nForm[searchInputName].onkeyup = function()
    			{
    			 buildSmartOptions(this.form);
    			}
    		collectOrigData(nForm[smartListName]);		
    	}
    
    	navigator.appName == "Microsoft Internet Explorer" ? attachEvent('onload', init, false) : addEventListener('load', init, false);	
    
    </script>
    <style type="text/css">
    
    	 body {background-color:#f0fff0; margin-top:65px; margin-bottom:65px;}
    
    </style>
    </head>
    <body>
          <form action="">
           
          		<input type="text" name="vipSearch" size="35">
    		
    		<br><br>
                 
          		<select name="vipInfo">
           			<option selected value="">Make a Selection</option>
                    	<option value="3857">O'Donnell, Patrick</option>
                    	<option value="9543">Babich, Timothy</option>
                   		<option value="5439">Alexander, Allison</option>
                    	<option value="3300">Atwood, James</option>
                    	<option value="7621">Cannon, Edith</option>
                    	<option value="5409">O'Grady, Lisa</option>
                    	<option value="1143">Bailey, Mary</option>
                    	<option value="0085">Conner, Anthony</option>
                    	<option value="1765">Allen, Mike</option>
    		</select>
                     
          </form>
       </body>
    </html>


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •