title: Check above form field is correctly fill out?
body: <p>I have a <code>HTML</code> form with some form fields. </p>
  
  <p>My Markup is something similar to this - </p>
  
  <pre><code>&lt;form&gt;
    &lt;div class="form-group"&gt;
      &lt;label for="exampleInputEmail1"&gt;First Name&lt;/label&gt;
      &lt;input type="text" class="form-control" placeholder="First Name"&gt;
    &lt;/div&gt;
    &lt;div class="form-group"&gt;
      &lt;label for="exampleInputPassword1"&gt;Email address&lt;/label&gt;
      &lt;input type="email" class="form-control"  placeholder="Enter email"&gt;
    &lt;/div&gt;
    &lt;button type="submit" class="btn btn-default"&gt;Submit&lt;/button&gt;
  &lt;/form&gt;
  </code></pre>
  
  <p>My question is, I want to keep second form field inactively (in this form it is `email field) till first form field is correctly fill out. Inactive mean user cannot type or paste any thing there. </p>
  
  <p>Can anybody tell is this possible in jquery, if so tell me how? </p>
  
  <p>Hope someone will guide me to correct path. 
  Thank you.  </p>