title: Input text validation using jQuery
body: <p>I have a situation where i want to validate the text entered into a input text field. This is the HTML code:</p>
  
  <pre><code>&lt;div id="err_title" style="display:none;"&gt;Please enter a valid Number.&lt;/div&gt;
  &lt;input type="radio" id="txt_a-radio" value="valueA" checked="checked"&gt;
  &lt;input type="text" id="txt_a"&gt;
  &lt;input type="radio" id="txt_b-radio" value="valueB"&gt;
  &lt;input type="text" id="txt_b" disabled&gt;
  </code></pre>
  
  <p>By default #txt_b field will be disabled, when user clicks on #txt_b-radio button #txt_b will be enabled and #txt_a will be disabled.</p>
  
  <p>The condition for validation is:</p>
  
  <pre><code>#txt_a can contain only 12 digit number
  #txt_b can contain only 20 digit number
  </code></pre>
  
  <p>Validation should happen once user enters value in enabled field then clicks anywhere outside. If value entered by user is not valid error message #err_title should display.</p>
  
  <p>Suppose if user enters value for #txt_a and then clicks on #txt_b-radio button then validation shouldn't happen since user has switched the input field.In this case #txt_a should be disabled and txt_b enabled.</p>
  
  <p>I have tried with the following code: </p>
  
  <pre><code>$('#txt_a').change(function() { 
      custNumber = $('#txt_a').val(); expression = /^[0-9]{12}$/; 
      if(custNumber === '') {
          $("#err_title").css('display', 'none'); 
      } else if ((!custNumber.match(regexp))) { 
          $("#err_title").css('display', 'block'); 
      } else { 
          $("#err_title").css('display', 'none'); 
      } 
  });
  </code></pre>