Drop down lists in Internet Explorer

Hi,

It would probably be possible to emulate the Notes functionality, but it would probably be slow as you would have to run a script on every key press.  The following JavaScript code modifies the options in a select element based on the value in a text field.  It makes no distinction as to whether it finds the phrase at the front of the option text, or anywhere within it, this may be better for you or you can change the regular expression to make this happen.  Also, no attempt is made to store the original contents of the options array so these are lost between page refreshes as soon as the button is pressed.

For this example to work the name of the select field needs to be "select1" and the name of the text field needs to be "search".  This script needs to be placed in the JSHeader section of the form you whish it to work on, and button formula that the user presses after typing in the search criteria needs to be JavaScript (obviously) and it should call the following:  

refineOptions();

If you want me to explain how to modify the regular expressions, or if you would like me to go into any more detail on anything else, let me know.

Cheers, Steve


function refineOptions() {
      var undefined;

      var searchValue = forms[0].elements.all.search.value;
      var searchString = new RegExp(searchValue)

      var selectObject = forms[0].elements.all.select1;
      var selectLength = selectObject.options.length

      var matchedValues= new Array();
      var matchedText= new Array();
      var matchedIndex = 0;

      for (i = 0; i < selectObject.options.length; i++) {
            var optionText = forms[0].elements.all.select1.options[i].text;
            var optionValue = forms[0].elements.all.select1.options[i].value;
            if (optionText.match(searchString)) {
      
                  matchedValues[matchedIndex] = optionValue;
                  matchedText[matchedIndex] = optionText;
                  matchedIndex++;
            }
      }



      for (j = 0; j < selectLength; j++) {

            selectObject.options[j] = null;

      }

      for (k = 0; k < matchedIndex; k++) {

            selectObject.options[k].value = matchedValues[k];
            selectObject.options[k].text = matchedText[k];

      }


}

Here my version.

Assign to the DialogList field onKeyDown event handler this JavaScript line:
return findOpt(this, event)

And in the JSHeader section put this function:

function findOpt(theSel, e){
  keyCode = (e.keyCode)? e.keyCode: e.which;
  keyChar = String.fromCharCode(keyCode).toLowerCase();
  window.status = keyChar;
  if(typeof theSel.searchStr=="undefined") {
    theSel.searchStr = "";
  }
  if((/[a-z0-9\ ]/i).test(keyChar)){
    searchStr = theSel.searchStr += keyChar;
    window.status = "Search: "+searchStr;
    opt = theSel.options;
    for(var i=0;i<opt.length;i++){
      if(opt[i].text.toLowerCase().indexOf(searchStr)==0){
        opt[i].selected = true;
        return false;
      }
    }
  }
  theSel.searchStr = "";
  window.status = "";
  return true;
}

When your DialogList field get focus you can type characters.
As long as the character sequence finds a match in the options you will see the option selected and the window stataus bar has the complete search string.
As soon as first key is not found in the options is the search string reset to empty string.
Doing so you can enter at any point the Escape key and start the search string from scratch.

Cool :)  Richard use Zvonko's solution!

Now I have a question: are you just attaching an arbitary property to the "theSel" object in the lines:

if(typeof theSel.searchStr=="undefined") {
    theSel.searchStr = "";
}

Cheers, Steve

Wow.
Thanks to the pair of you for helping me with this and thanks for that code Zvonko.  It is exactly what I want!

You are welcome.