title: how to validate my form field after my check box is checked?
body: <p>i have created one form with dynamically created fields. and i have a one check box with unique ID . when user clicks that check box  then only those two fields are visible ("name and age"). after clicking only "age" field need to  be validate . </p>
  
  <p>here is my code :</p>
  
  
  
  <pre><code>$(document).ready(function() {
      $('#person').click(function() {
          function formValidator(){
              var age = document.getElementsByName('age[]');
              for (var i = 0; i&lt; age.length; i++) {
                  if(!isNumeric(age[i], "Please enter a valid Age")){
                      return false;
                  }
              }
              return true;
          }
  
          function isNumeric(elem, helperMsg){
              var numericExpression = /^[0-9]+$/;
              if(elem.value.match(numericExpression)){
                  return true;
              } else {
                  alert(helperMsg);
                  elem.focus();
                  return false;
              }
          }
     });
  });
  
  $(document).ready(function() {
      $('#person').click(function() {
          $('#name').attr('required','required');
          $('#age').attr('required','required');
      });
  });
  </code></pre>
  
  <p>style is :</p>
  
  <pre class="lang-css prettyprint-override"><code>.selectContainer{
      display:none;
   }
  
  input[type=checkbox]:checked ~ .selectContainer {
      display:block;
  }
  </code></pre>
  
  <p>Html code is:</p>
  
  <pre class="lang-html prettyprint-override"><code>&lt;form action="" method="post" onSubmit="return formValidator()"&gt;
      &lt;label for="name"&gt;Any Accompanying Person ?:&lt;/label&gt;
      &lt;input  type="checkbox" name="person" id="person" &gt;Yes
      &lt;div class="selectContainer"&gt;
          &lt;br&gt;
          &lt;label&gt;Person Details&lt;/label&gt;
          &lt;p&gt;
              &lt;div style="padding-left:70px;"&gt; 
                  &lt;input type="button" value="Add Person" onClick="addRow('dataTable')" /&gt; 
                  &lt;input type="button" value="Remove Person" onClick="deleteRow('dataTable')" /&gt; 
              &lt;/div&gt;
          &lt;/p&gt;
          &lt;table style="padding-left:50px;" id="dataTable" class="form" border="1"  &gt;
              &lt;tbody&gt;
                  &lt;tr&gt;
                      &lt;p&gt;
                          &lt;td&gt;&lt;input type="checkbox" name="chk[]" checked="checked" /&gt;&lt;/td&gt;
                          &lt;td&gt;
                              &lt;label&gt;Name&lt;/label&gt;
                              &lt;input type="text" size="20" name="name[]" id="name"   &gt;
                          &lt;/td&gt;
                          &lt;td&gt;
                              &lt;label&gt;Age&lt;/label&gt;
                              &lt;input type="text" size="20" name="age[]" id="age"  &gt;
                          &lt;/td&gt;
                      &lt;/p&gt;
                &lt;/tr&gt;
             &lt;/tbody&gt;
         &lt;/table&gt;
         &lt;div class="clear"&gt;&lt;/div&gt;
         &lt;/fieldset&gt;
     &lt;/div&gt;
  &lt;/div&gt;
  &lt;h3&gt;Choose Your Payment Option&lt;/h3&gt;
  &lt;h1&gt;
  &lt;div style="padding-left:150px;"&gt;
      &lt;input type="radio" name="type" value="visa"&gt;VISA/MASTER CARD:&lt;br /&gt;
      &lt;input type="radio" name="type" value="cheque"&gt; CHEQUE/DEMAND DRAFT&lt;br /&gt;
      &lt;input type="radio" name="type" value="neft"&gt;NEFT&lt;br /&gt;&lt;br/&gt;
  &lt;/div&gt;
  &lt;label&gt;&lt;/label&gt;
  &lt;input type="submit" name="submit" value="submit"&gt;&lt;br /&gt;
  &lt;/form&gt;
  </code></pre>
  
  <p>problem: the form field "age" is validating successfully by clicking check box ("Any Accompanying Person ?:"). problem is when user try to submit the form without clicking that check box then all so its asking for validate . how get salutation for this ? please help     </p>