Chain dropdown menus with HTML and JavaScript and another quick question about the forums

JavaScript
6

The following script allows you to select a Country and then populate a 2nd dropdown list with several cities.

<script type="text/javascript">
var A= [];
A["Australia"]=["Select City ...","Sydney","Melbourne","Brisbane","Adelaide"];
A["UK"]=["Select City ...","London","York","Manchester","Cardiff","Liverpool"];
//
 function process(obj,sNumb) 
  { var indx, targetObj, targArray, thisItem, i=0;  
    indx=obj.options.selectedIndex;
    if(indx===0){ return; }                      // invalid selection 
   // ---------  
 // put object items list into next select box
     targetObj=document.getElementById("select_"+sNumb);
     targetObj.disabled=false;
 // clear existing options. 
     targetObj.options.length=0;              
     thisItem=null;                         
 // build options list
     targArray = A[obj.options[indx].value];   
     for(i=0;i<targArray.length;i++)
       { thisItem=targArray[i];      
         // syntax is new Option("text", "value", isDefaultSelectedFlag, isSelectedFlag) 
           targetObj.options[i]=new Option(thisItem,thisItem,false,false);    
       } 
     obj.blur(); 
    }
 // -------
 function rSet(aForm)
  { // reset to original values
    var selectObj_2=document.getElementById("select_2");
    selectObj_2.length=0; 
    selectObj_2.disabled=true; 
    aForm.reset();
  }   
// --------
</script>

Here is the whole working program on JSFiddle

1 Like