title: Validate Textbox Javascript
body: <p>I am trying to validate the textbox in the login Xhtml and once I figured out the code, the section class'container' in the code is not working. </p>
  
  <p>How can I write the code and validate the textbox properly?</p>
  
  <pre><code>&lt;head&gt;
      &lt;script type = 'text/javascript'&gt;
          function validate() {
              if (document.getElementById("login").value == "") {
                  alert("User name may not be blank");
              } else if (document.getElementById("password").value == "") {
                  alert("Password may not be blank.");
              }
          }
      &lt;/script&gt; 
      &lt;title&gt;Login Form&lt;/title&gt;
      &lt;link rel="stylesheet" href="css/style.css"/&gt; 
  &lt;/head&gt;    
  &lt;body&gt;
      &lt;h1&gt; Login&lt;/h1&gt;
      &lt;section class="container"&gt;
          &lt;div&gt;         
              &lt;form method="post" action="index.xhtml" onsubmit="return validate();"&gt;
                  &lt;p&gt;
                      &lt;input type="text" name="login" value="" id="login" placeholder="Username or Email" /&gt;
                      &lt;input type="password" name="password" value="" id="password" placeholder="Password" /&gt;
                  &lt;/p&gt;
                  &lt;p&gt;
                      &lt;label&gt;
                          &lt;input type="checkbox" name="remember_me" id="remember_me" /&gt;Remember me on this computer
                      &lt;/label&gt;
                  &lt;/p&gt;
                  &lt;p class="submit"&gt;
                      &lt;input type="submit" name="commit" value="Login" onclick="validate();" /&gt;
                      &lt;button type="reset" value="Clear"&gt;Clear&lt;/button&gt;
                  &lt;/p&gt;
              &lt;/form&gt;
              &lt;form action= "http://localhost:8080/ChattBank/LoginServlet" method="post"/&gt;
          &lt;/div&gt;
      &lt;/section&gt;
  &lt;/body&gt;
  </code></pre>