Input text validation using jQuery
<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>