title: Using JavaScript and a dropdown to change page content
body: <p>Google has plenty of results for <em>similar</em> problems, but after a day of searching, I still cannot figure this out.</p>
  
  <p>I have a dropdown menu with six choices.</p>
  
  <p>I have a switch statement with which I would like to evaluate the chosen item in the dropdown list to determine which document.write statements to execute.</p>
  
  <p>Please keep in mind that the variables in the document write statements are defined before this block of code picks up. Also, the opening  tag exists much earlier in the code as well.</p>
  
  <p>Thank you for your help.</p>
  
  <pre><code>    function handleSelect(account)
      {
          //var selectedAcct = document.getElementByName("acctTypes");
  
          document.write("&lt;table&gt;&lt;tbody&gt;");
  
          switch(account)
          {
  
              case "View All":
                  document.write(savings);
                  document.write(checking);
                  document.write(moneymkt);
                  document.write(cdjumbo);
                  document.write(cdsmall);
                  document.write(iras);
                  break;
              case "Certificates of Deposit (CDs)":
                  document.write(cdjumbo);
                  document.write(cdsmall);
                  break;
              case "Individual Retirement Account (IRA)":
                  document.write(iras);
                  break;
              case "Money Market":
                  document.write(moneymkt);
                  break;
              case "Savings":
                  document.write(savings);
                  break;
              case "Checking":
                  document.write(checking);
                  break;
              default:
                  document.write(savings);
                  document.write(checking);
                  document.write(moneymkt);
                  document.write(cdjumbo);
                  document.write(cdsmall);
                  document.write(iras);
          }
  
          document.write("&lt;/tbody&gt;&lt;/table&gt;");
      }
  
  
  &lt;/script&gt;
  
  &lt;form name="acctTypes" action=" "&gt;
      &lt;select name="acctDropdown" id="acctDropdown" onLoad="handleSelect(this.value)" onChange="handleSelect(this.value)"&gt;
          &lt;option value="View All" selected&gt;View All&lt;/option&gt;
          &lt;option value="Certificates of Deposit (CDs)"&gt;Certificates of Deposit (CDs)&lt;/option&gt;
          &lt;option value="Individual Retirement Account (IRA)"&gt;Individual Retirement Account (IRA)&lt;/option&gt;
          &lt;option value="Money Market"&gt;Money Market&lt;/option&gt;
          &lt;option value="Savings"&gt;Savings&lt;/option&gt;
          &lt;option value="Checking"&gt;Checking&lt;/option&gt;
      &lt;/select&gt;
  &lt;/form&gt;
  </code></pre>