title: Assigning html form input a JS variable
body: <p>I'm trying to take user form input and display it back to the user, among other things (all of which require the input being stored as a JS variable). </p>
  
  <p>I'm trying to spit it out in an alert, as a quick feedback loop, and all I keep getting is [object HTMLInputElement]. I've tried to use document.forms[0] and document.getElementById (like below) and neither work. Also, I'm using bootstrap typeahead, could that be complicating this issue?</p>
  
  <p>What am I missing?</p>
  
  <p>Here's the code:</p>
  
  <pre><code>&lt;div class="hero-unit"&gt;
      &lt;h1&gt; Title &lt;/h1&gt;
      &lt;p&gt; This form description &lt;/p&gt;  
      &lt;form class="well" name="formInput" action= "#"&gt;
          &lt;label&gt;Input&lt;/label&gt;
          &lt;input Id="txtvarInput" class="span3" style="margin: 0pt auto;" type="text" placeholder="AAA, BBB, CCC..." data-provide="typeahead" data-items="10" data-source="[&amp;quot;AAA&amp;quot;,&amp;quot;BBB&amp;quot;,&amp;quot;CCC&amp;quot;,&amp;quot;DDD&amp;quot;,&amp;quot;EEE&amp;quot;,&amp;quot;FFF&amp;quot;,&amp;quot;GGG&amp;quot;,&amp;quot;HHH&amp;quot;,&amp;quot;III&amp;quot;,&amp;quot;JJJ&amp;quot;,&amp;quot;KKK&amp;quot;,&amp;quot;LLL&amp;quot;]"/&gt;               
          &lt;/label&gt;
          &lt;div class="form-actions" "span3"&gt;
              &lt;input name="submit" type="submit" class="btn" value="Select" onclick="alert('you chose ' + theInput.value)"/&gt;
              &lt;script language="JavaScript" type="Text/JavaScript"&gt;
                  var theInput = document.getElementById('txtvarInput');
              &lt;/script&gt;
          &lt;/div&gt;
      &lt;/form&gt;
  &lt;/div&gt;
  
  &lt;div class="page-header"&gt;
      &lt;h1&gt;Input:
          &lt;script language="JavaScript" type="Text/JavaScript"&gt;
              document.write(theInput.value);
          &lt;/script&gt;
      &lt;/h1&gt;
  </code></pre>
  
  <p>Edit: PART II, now the code works for the alert, but I need to use it elsewhere (like I said) and the variable isn't available in other sections of the html. Above, I'm just trying to get it to display that same value as a part of the html. It could be my JS, but this is pretty boilerplate stuff, so I think it's related to the location of the variable.</p>
  
  <p>What do I need to do use it elsewhere? I've added the next div above to show what I'm trying.</p>
  
  <p>--left an extra declaration of the variable in part II by accident, was one of the tests I was trying, removed now.</p>