Search code examples
javascriptdom-eventsonkeyup

onKeyUp function not returning all results


Background - I have a form with a text field. The user enters 2-6 digit integers. On each key stroke, the Javascript function is called matching up values from a dropdown.

My text field:

<input type="text" name="orgSICCode" value="" allownull="FALSE" size="5" maxlength="10" datatype="dtNumeric" onKeyUp="ActivateOption(description,this.value);" onBlur="this.value = description.options[description.selectedIndex].value;" emsg="Must choose a SIC Code before you can continue.">

My dropdown field:

    <select name="description" STYLE="width:275px;" onChange="orgSICCode.value = this.options[this.selectedIndex].value;sic_code_description.value = this.options[this.selectedIndex].text;">
       <option value="">Select One ...</option>
       <option value="085101">085101 - Forest management services</option>
       <option value="0831">0831 - Forest Products</option>
       <option value="083100">083100 - Forest products</option>
       <option value="083199">083199 - Forest products, nec</option>
       <option value="08">08 - Forestry</option>
    </select>

My Javascript function ActivateOption:

function ActivateOption(selectObj, strValue) {
   for(var idx=0;idx<selectObj.options.length;idx++) {
      if(selectObj.options[idx].value.substring(0,strValue.length) == strValue) {
        selectObj.selectedIndex = idx;
        return true;
      }
   }
   selectObj.selectedIndex = 0;
   return false;
}

When a user types '08', the first option that should populate is the 08 value, "08 - Forestry" option. The option that does populate is '085101', '085101 - Forest Management services'.

Am I doing something wrong?


Solution

  • use a better filter to check the option string

    // this function return the most similer string, 
    // sarr take a string arr which to filte
    
    function checkString ( sarr, srcStr ) {
        var ret = "", val = 0, srcStr = srcStr.split("");
            sarr.forEach( function  ( content, index  ) { 
                var i, l, curval = 0, cont = content.split("");
                for ( i = 0, l = cont.length; i < l; i += 1 ){
                    if ( cont [i] === srcStr[i] ){
                        curval += Math.pow ( 10, i );
                    } else {
                        break;
                    }
                }
                if ( curval > val ){
                    val = curval;
                    ret = content;
                } else if ( curval === val && Math.abs ( content.length - srcStr.length ) < Math.abs ( ret.length - srcStr.length ) ){
                    ret = content;
                }
            })
            return ret; 
    }