title: Javascript Document.getElementById returning null
body: <p>I'm new to MVC and AJAX so this is probably a simple mistake I am making but using the code below, I am getting the following error trying to <code>getElementById("txtCount").value</code>:</p>
  
  <pre><code>&lt;div class="row"&gt;
      &lt;div class="col-sm-4"&gt;
          &lt;div class="panel panel-primary"&gt;
              &lt;div class="panel-heading"&gt;
                  &lt;h5 style="font-weight:bold;"&gt;Parameters&lt;/h5&gt;
              &lt;/div&gt;
              &lt;div class="panel-body" id="parameters"&gt;
                  &lt;form class="form-horizontal" id="frmParameters"&gt;
                      &lt;div class="form-group"&gt;
                          &lt;label for="txtCount" class="col-sm-4 col-form-label"&gt;Repeat&lt;/label&gt;
                          &lt;input type="number" min="1" max="100" step="1" id="txtCount" value="@Model.Count" class="input-sm col-sm-7" /&gt;
                      &lt;/div&gt;
                      @if (Model.Grammar.SupportsMaxLength)
                      { 
                          &lt;div class="form-group"&gt;
                              &lt;label for="txtMaxLength" class="col-sm-4 col-form-label"&gt;Max Length&lt;/label&gt;
                              &lt;input type="number" min="1" max="100" step="1" id="txtMaxLength" value="@Model.MaxLength" class="input-sm col-sm-7" /&gt;
                          &lt;/div&gt;
                      }                        
                      &lt;button name="btnGenerate" class="btn btn-primary pull-right" onclick="Generate();"&gt;Generate&lt;/button&gt;
                  &lt;/form&gt;
              &lt;/div&gt;
          &lt;/div&gt;
      &lt;/div&gt;
  &lt;/div&gt;
  
  &lt;script&gt;
      function Generate() {
      var data = { count: document.getElementById("txtCount").value, maxLength: document.getElementById("txtMaxLength").value };
      }
  &lt;/script&gt;
  </code></pre>
  
  <p>If I change:</p>
  
  <pre><code>    var data = { count: document.getElementById("txtCount").value, maxLength: document.getElementById("txtMaxLength").value };
  </code></pre>
  
  <p>to:</p>
  
  <pre><code>    var data = { count: document.getElementById("txtCount").value};
  </code></pre>
  
  <p>I don't get the error anymore.</p>