Dynamical Select List

[Total: 0    Average: 0/5]

This script is to implement a dynamical select list. When you select item1 from a drop down list, it automatically displays the other drop down list or anything else (you can modify it to fit your needs); if you select item2, the drop down list of item1

Head Code:

<style type="text/css">
<!--
.selection {position:absolute; visibility:hidden}
-->
</style>
<script type=text/javascript>
<!--
if (document.layers) {
  visible='show';
  hidden='hide';
} else {
  if (document.all) {
    visible='visible';
    hidden='hidden';
  }
}

function populateSelevtList(selected) {
  if (selected == "Test1") {
    if (document.all) {
      selectitem = document.all["selection"].style;
    }
    if (selectitem.visibility==hidden) {
      selectitem.visibility=visible;
    }
  } else {
    if (document.all) {
      selectitem = document.all["selection"].style;
    }
    selectitem.visibility=hidden;
  }
}
-->
</script>

Body Code:

<form name="selectiontest" action="" method="post">
<table><tr><td>&nbsp;</td></tr>
<tr><td>Select Item&nbsp;</td>
<td><select name="test" size=1 onChange="populateSelevtList(document.selectiontest.test.options[document.selectiontest.test.selectedIndex].value)">
  <option value="">select what you want</option>
  <option value="Test1">Item1</option>
  <option value="Test2">Item2</option>
  </select>
</td></tr>
<tr><td>&nbsp;</td>
<td>
<div id="selection" style="top:0;left:0; visibility:hidden">
  <select name="testt" size=1>
    <option value="">select List From Item1</option>
    <option value="Test11">Item11</option>
    <option value="Test12">Item212</option>
  </select>
</div></td></tr></table>
</form>

Times Viewed: 3

Leave a Reply

Your email address will not be published. Required fields are marked *