Option Search

Written by admin on December 26, 2008 – 6:38 am -

In our example, search for a value between ‘a1′ and ‘a15′. Saves time when it comes to navigating within long pull down menus.
Author: Darko Egersdorfer (darkoe@za.bynx.com) 

<!-- TWO STEPS TO INSTALL OPTION SEARCH:

  1.  Copy the coding into the HEAD of your HTML document
  2.  Add the last code into the BODY of your HTML document  -->

<!-- STEP ONE: Paste this code into the HEAD of your HTML document  -->

<HEAD>

<SCRIPT LANGUAGE="JavaScript">

<!-- Begin
function promptSearch (thisform, thisfield) {
var elnum = parseInt(-1);
var k = parseInt(-1);
for (var j = 0; j < document.forms[thisform].elements.length; j++) {
if (document.forms[thisform].elements[j].name == thisfield) {
elnum = j;
break;
   }
}
var myvar = “”;
var srch = “”;
var menuLength = “”;
menuLength = eval(”document.” + thisform + “.” + thisfield + “.length”);
srch = prompt(”Search this menu for…”, “”);
if (srch ) {
srch = srch.toUpperCase();
for (var i = 0; i < menuLength; i++) {
myvar = eval(”document.” + thisform + “.” + thisfield + “.options[" + i + "].text.toUpperCase()”);
if (myvar.indexOf(srch) >= 0) {
document.forms[thisform].elements[elnum].options[i].selected = true;
break;
      }
   }
}
return false;
}
//  End –>
</script>
</HEAD>

<!– STEP TWO: Copy this code into the BODY of your HTML document  –>

<BODY>

<center>
<form name=myform action=”">
<select name=menu1 size=1 onFocus=”promptSearch(this.form.name, this.name)”>
<option>a1
<option>a2
<option>a3
<option>a4
<option>a5
<option>a6
<option>a7
<option>a8
<option>a9
<option>a10
<option>a11
<option>a12
<option>a13
<option>a14
<option>a15
</select>
</form>
</center>

<!– Script Size:  1.90 KB –>

Tags:
Posted in Forms |

Post a Comment