Q1694 How can I change a selected item in one select box based on a choice from another select box without using frames?

<script language="JavaScript"><!--
function UpdateList(object) {
  // Remove all existing items from select2 list
  object.select2.options.length = 0;

  var defaultSelected = false;
  var selected = false;

  // add items based on the selected option of select1
  if (object.select1.options[object.select1.selectedIndex].value == "default") {
    var optionName = new Option("Default", "default", defaultSelected, selected);
    var length = object.select2.length;
    object.select2.options[length] = optionName;
  }

  if (object.select1.options[object.select1.selectedIndex].value == "FirstOption") {
    var optionName = new Option("ItemOneText", "ItemOneValue", defaultSelected, selected);
    var length = object.select2.length;
    object.select2.options[length] = optionName;

    var optionName = new Option("ItemTwoText", "ItemTwoValue", defaultSelected, selected);
    var length = object.select2.length;
    object.select2.options[length] = optionName;
  }

  if (object.select1.options[object.select1.selectedIndex].value == "SecondOption") {
    var optionName = new Option("FirstItemText", "FirstItemValue", defaultSelected, selected);
    var length = object.select2.length;
    object.select2.options[length] = optionName;

    var optionName = new Option("SecondItemText", "SecondItemValue", defaultSelected, selected);
    var length = object.select2.length;
    object.select2.options[length] = optionName;
  }
  
  // Do the next line to make sure the top item is selected
  object.select2.options[0].selected = true;
}
//--></script>

<form name="formname">
<select name="select1" size="1" onChange="UpdateList(document.formname);">
  <option value="default">Default</option>
  <option value="FirstOption">First Option</option>
  <option value="SecondOption">Second Option</option>
</select>

<select name="select2" size="1">
  <option value="default">default</option>
</select>
</form>