title: Logic for Form Validation for JS
body: <p>Assume I have two forms, firstName and lastName.</p>
  
  <p>I have an alphanumericvalidation method which I tested individually.</p>
  
  <pre><code>   function alphaNumericValidation(Name)
     {
       if(/[^a-zA-Z0-9]/.test(firstName.value) || firstName.value == "") 
       {
         Name.style.border = "1px solid red";
         Name.focus();
         return false;
      }
      return true;
     }
  </code></pre>
  
  <p>now, I have a validation method which the code submits to:</p>
  
  <pre><code> &lt;td&gt;&lt;input type="submit" name="smbt" id="smbt" value="Next" class="nextBtn" onclick="return validation();"/&gt;&lt;/td&gt;
  </code></pre>
  
  <p>the validation method is written as</p>
  
  <pre><code>  function validation()
    {
      var firstName = document.getElementById("firstName");
      var lastName = document.getElementById("lastName");
  
      if (alphaNumericValidation(firstName))
      {
          if (alphaNumericValidation(lastName))
          {
              return true;
          }
     }
     else
              return false;
  </code></pre>
  
  <p>however the logic is wrong and it does not work as intended. What am I doing wrong?</p>