Validatation control in Phone Number Using Jquery


Html


Phone Number: <input type='text' id='txtPhone'/>
<span id="spnPnestats"></span>

CSS:

body
{
    padding: 10px;
    font-family: Arial;
    Font-size: 10pt;
}
span
{
    font-weight:bold;
}

JQuery:

$(document).ready(function() {
    $('#txtPhone').blur(function(e) {
        if (validatePhone('txtPhone')) {
            $('#spnPnestats').html('Valid');
            $('#spnPnestats').css('color', 'green');
        }
        else {
            $('#spnPnestats').html('Invalid');
            $('#spnPnestats').css('color', 'red');
        }
    });
});

function validatePhone(txtPhone) {
    var a = document.getElementById(txtPhone).value;
    var filter = /^[0-9-+]+$/;
    if (filter.test(a)) {
        return true;
    }
    else {
        return false;
    }
}


Output:

Phone Number: Valid

Comments

Popular posts from this blog

Insecure cookie setting: missing Secure flag

Maximum Stored Procedure Function Trigger or View Nesting Level Exceeded (limit 32) in SQL Server

Display Line Chart Using Chart.js MVC C#