title: Changing Mailto recipient through Javascript based on Selection Form
body: <p>I'm trying to set up a HTML Form that will allow users to email comments or questions to different departments of our company. I do not have back-end access to the website...it's a corporate template we cannot adjust. So, I can't us PHP or other preferred ways to get this done.</p>
  
  <p>I have pretty good understanding of HTML &amp; CSS...but never dealt with javascript.</p>
  
  <p>I have the form built with a select menu for 4 different departments. then inputs for name, email, and then textarea for their comment.</p>
  
  <p>I set it all up and the form worked when I sent it to my single email address. However, I'd like the mailto: address to change based on what option is selected.</p>
  
  <p>I've read a lot into it...and it looks like it needs to be a combination of "onchange" event...a variable to represent the email...and the "if else if, else if" condition.</p>
  
  <p>I just have no idea how to put it together in javascipt...What i've tried doesn't work, and I'm really just not familiar enough with java to make it work.</p>
  
  <p>Any assistance is greatly appreciated</p>
  
  <p>Thanks,
  Folfer</p>
  
  <p>---Update---
  Here's what I have for the basic HTML Form</p>
  
  <pre><code>&lt;form action="MAILTO:XXXXX@XXXX.com" enctype="text/plain" method="post"&gt;
  &lt;div&gt;&lt;label for="Department"&gt;Department:&lt;/label&gt;
  &lt;select&gt;
  &lt;option value="News"&gt;News&lt;/option&gt;
  &lt;option value="Prog"&gt;Programming&lt;/option&gt;
  &lt;option value="Prom"&gt;Promotions&lt;/option&gt;
  &lt;option value="Eng"&gt;Engineering&lt;/option&gt;
  &lt;/select&gt;&lt;/div&gt;
  &lt;div&gt;&lt;label for="name"&gt;Your Name:&lt;/label&gt; &lt;input name="name" type="text" /&gt;&lt;/div&gt;
  &lt;div&gt;&lt;label for="mail"&gt;Your E-mail:&lt;/label&gt; &lt;input name="email" type="email" /&gt;&lt;/div&gt;
  &lt;div&gt;&lt;label for="msg"&gt;Message:&lt;/label&gt;&lt;textarea name="message" style="margin-top: -20px; margin-bottom: 0px; height: 60px;"&gt;&lt;/textarea&gt;&lt;/div&gt;
  &lt;div&gt;&lt;button type="submit"&gt;Send your message&lt;/button&gt;&lt;button type="reset"&gt;Clear&lt;/button&gt;&lt;/div&gt;
  &lt;/form&gt;
  </code></pre>
  
  <p>I had some CSS to spruce it up, but this is the basic HTML.</p>