title: How to change a form input text to uppercase using a JavaScript function
body: <p>I'm trying to change a form input field (username) to uppercase and to remove all spaces within the text. I know there are a few ways one could do this but I need to figure out how to do this using a function. I need to get the input by it's id and use the toUpperCase method but I cannot figure this out for the life of me. As you might be able to tell, I am new to JavaScript. Any help would be greatly appreciated. Thank you.</p>
  
  <p>HTML:</p>
  
  <pre><code>&lt;div class="login-form"&gt;
                  &lt;h1 class="h1-login"&gt;Welcome&lt;/h1&gt;
                  &lt;h4&gt;Please login to enjoy our services&lt;/h4&gt;
  
                  &lt;form class="login-form" name="login-form" method="post"&gt;
  
                      &lt;label for="username"&gt;&lt;span class="required"&gt;*&lt;/span&gt;Username:&lt;/label&gt;
                          &lt;input id="username" type="text" name="username" autofocus onkeyup="changeToUpperCase()"&gt;
                      &lt;label for="password"&gt;&lt;span class="required"&gt;*&lt;/span&gt;Password:&lt;/label&gt;
                          &lt;input type="password" name="password" size="8" maxlength="8"&gt;
  
                      &lt;input class="login" type="submit" value="Login"&gt;
  
                  &lt;/form&gt;
  
              &lt;/div&gt;  
  </code></pre>
  
  <p>Here is the JavaScript:</p>
  
  <pre><code>function changeToUpperCase() {
  document.login-form.value = document.login-form.value.toUpperCase();
  }
  </code></pre>
  
  <p>This code does not work... and I have no idea how to remove spaces from an input text. Please help me.</p>