title: object oriented javascript form registeration
body: <p>i am new to the object oriented javascript :)
  i have written this code to validate the first name of a registration form, but it is not working</p>
  
  <pre><code> &lt;!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"
  "http://www.w3.org/TR/html4/strict.dtd"&gt;
  
  &lt;html xmlns="http://www.w3.org/1999/xhtml" lang="en"&gt;
      &lt;head&gt;
          &lt;meta http-equiv="Content-Type" content="text/html; charset=utf-8" /&gt;
          &lt;title&gt;OOForm&lt;/title&gt;
          &lt;meta name="author" content="engy" /&gt;
          &lt;!-- Date: 2015-02-20 --&gt;
          &lt;script&gt;
          var Form = {
              fname:{
                  minLength : 1,
                  maxLength : 15,
              },
              validateLength:function(formEl,type){
                  if(formEl.value.length&gt;type.maxLength||formEl.value.length&lt;type.minLength){
                      document.getElementById("firstNameSpan").innerHTML = "&lt;font color='red'&gt;Invalid User Name&lt;/font&gt;";
                      return false;
                  }
                  else{
                      document.getElementById("firstNameSpan").innerHTML = "";
                      return true;
                  }
              },
          };
  
          function checkForm(){
              var ourForm = document.getElementById("ourForm");
              var inputs = ourForm.getElementsByTagName("input");
              if(Form.validateLength(inputs[0],Form.fname)){
                      document.getElementById("mySubmit").disabled = false;
                      return true;
                  }
  
          document.getElementById("mySubmit").disabled = true;
          return false;
          }
      &lt;/script&gt;
      &lt;/head&gt;
      &lt;body&gt;
          &lt;form id="ourForm"&gt;
              &lt;label&gt;First Name&lt;/label&gt;
              &lt;input type="text"/&gt;
              &lt;span id="firstNameSpan"&gt; &lt;/span&gt;
              &lt;br/&gt;
  
              &lt;input type="submit" value="submit" id="mySubmit" onclick="return checkForm()"&gt;
          &lt;/form&gt;
      &lt;/body&gt;
  
  &lt;/html&gt;
  </code></pre>
  
  <p>i don't know what is the problem with the code, but when i enter the firstname with invalid value and then press submit, it do nothing but clearing the text field
  and the "invalid" span do not appear </p>