title: Javascript is not getting the correct html form value
body: <p>I have a javascript autocomplete. The autocomplete function works. I have a php script where it pulls 'subtypes; from a 'type' in mysql and results correctly. but i can't seem to get javascript to pass on the 'type' value (dropdown) if it has changed after the page lode. How can i get this function to work correctly if I change the 'type' dropdown element in the form after the page load?</p>
  
  <p>The Javascript:</p>
  
  <pre><code>&lt;script&gt;
  $(document).ready(function(){
  var e = document.getElementById("type");
  var type = e.options[e.selectedIndex].value;
   $("#subtype").autocomplete("autocomplete/subtype.php?type="+type, {
          selectFirst: true
      });
  });
  &lt;/script&gt;
  </code></pre>
  
  <p>The HTML:   </p>
  
  <pre><code>&lt;select id="type" name="type"&gt; 
          &lt;option value="option1" selected="selected"&gt;option1&lt;/option&gt;
          &lt;option value="option2"&gt;option2&lt;/option&gt;
          &lt;option value="option3"&gt;option3&lt;/option&gt;
          &lt;option value="option4"&gt;option4&lt;/option&gt;
  
      &lt;/select&gt; &lt;/p&gt;
       &lt;p&gt;&lt;input type="text" name="subtype" id="subtype" value="" placeholder="Sub-Type"&gt;&lt;/p&gt;
  </code></pre>
  
  <p>Thank You for your help. I'm new to javascript.</p>