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

Display Canvasjs Line Chart using Data from Database

What are the SOLID principles, and why are they important

Write Text in Notepad files Using Asp.net