»
EnglishFrenchVietnamese

Print - Testing the search capabilities - JavaScriptBank.com

Full version: jsB@nk » Form » Dropdown » Testing the search capabilities
URL: https://www.javascriptbank.com/testing-the-search-capabilities.html

Testing the search capabilities © JavaScriptBank.comVisitors can select fast a option by typing first character of that option.

Full version: jsB@nk » Form » Dropdown » Testing the search capabilities
URL: https://www.javascriptbank.com/testing-the-search-capabilities.html



JavaScript
<SCRIPT language=JavaScript><!--//==========================================================================////Function:searchSelectBox(in_sFormName, in_sInputName, in_sSelectName)//Purpose: Acts as a "searchable" input for a given select box.//Parameters://in_sFormName - The form name where the elements live//in_sInputName - The "search input element name.//in_sSelectName- The select box to search against.////==========================================================================//function searchSelectBox(in_sFormName, in_sInputName, in_sSelectName){sSearchString = document.forms[in_sFormName].elements[in_sInputName].value.toUpperCase();iSearchTextLength = sSearchString.length;for (j=0; j < document.forms[in_sFormName].elements[in_sSelectName].options.length; j++){sOptionText = document.forms[in_sFormName].elements[in_sSelectName].options[j].text;sOptionComp = sOptionText.substr(0, iSearchTextLength).toUpperCase();if(sSearchString == sOptionComp){document.forms[in_sFormName].elements[in_sSelectName].selectedIndex = j;break;}}}//--></SCRIPT><!--    This script downloaded from www.JavaScriptBank.com    Come to view and download over 2000+ free javascript at www.JavaScriptBank.com-->


HTML
<FORM name=SearchForm>  <INPUT onkeyup="JavaScript: searchSelectBox('SearchForm', 'edSeachInput', 'cbSearchSelect')" name=edSeachInput size="20"><BR><SELECT size=8 name=cbSearchSelect> <OPTION   value=abc>BLACKPLATE</OPTION> <OPTION value=abc>COLD ROLLED COIL HORIZ</OPTION> <OPTION value=abc>COLORBOND COIL VERT</OPTION> <OPTION   value=abc>COPPER CONC</OPTION> <OPTION value=abc>DOWNGRADE</OPTION> <OPTION   value=abc>FERRO MN</OPTION> <OPTION value=abc>GALV COIL HORIZ</OPTION> <OPTION   value=abc>GALV COIL VERT</OPTION> <OPTION value=abc>HOT ROLLED COIL</OPTION>   <OPTION value=abc>PLATE</OPTION> <OPTION value=abc>STRUCTURALS</OPTION>   <OPTION value=abc>TINPLATE</OPTION> <OPTION value=abc>TINPLATE COIL HORIZ</OPTION> <OPTION value=abc>TINPLATE WASTE</OPTION> <OPTION   value=abc>WRIC</OPTION> <OPTION value=abc>ZINC ALUM COIL HORIZ</OPTION>   <OPTION value=abc>ZINC ALUM COIL VERT</OPTION></SELECT> </FORM><!--    This script downloaded from www.JavaScriptBank.com    Come to view and download over 2000+ free javascript at www.JavaScriptBank.com-->