JQuery to Validate Email Address using Regular Expression in Asp.Net C# VB.Net

Almost in every applications validation is a major part. Registration page is one of them. In all registration page we need to validate Email address from client side. Here in this article I will demonstrate the way of Jquery Email address validation using Regular expression. Hope you can use the below Jquery validation code block in C# as well as VB.Net applications also.

Related Article:
Client side Email Address Validation Using Javascript in Asp.Net C# VB.Net apsx page

Objective/Outcome:
JQuery_Email_Address_Validation_Asp.net_Csharp_VB.net

Simple HTML Markup to Test the Example:

<asp:TextBox ID='txtEmail' runat="server"></asp:TextBox><br /><br />
<asp:Button id="cmd_Check_Email" runat="server" Text="Check Email Address" />

Jquery Code to Validate Email Address using Regular Expression:

    <script type="text/javascript">
    $(document).ready(function () {
        $('#<%=cmd_Check_Email.ClientID %>').click(function () {
            var s_User_Email_ID = $('#<%=txtEmail.ClientID %>').val();
            var regex = /^[a-zA-Z0-9._-]+@([a-zA-Z0-9.-]+\.)+[a-zA-Z0-9.-]{2,4}$/;
            if (regex.test(s_User_Email_ID))
                alert('Valid Email Address Found.');
            else
                alert('Wrong Email Address Found !!');
        });
    });  
    </script>

So simple. Am I right? OK now we want to modify a little bit better for look & feel. Modify the Jquery Email Address validation function like below:

    <script type="text/javascript">
        $(document).ready(function () {
            $('#<%=cmd_Check_Email.ClientID %>').click(function () {
                var s_User_Email_ID = $('#<%=txtEmail.ClientID %>').val();
                var regex = /^[a-zA-Z0-9._-]+@([a-zA-Z0-9.-]+\.)+[a-zA-Z0-9.-]{2,4}$/;
                if (regex.test(s_User_Email_ID))
                    $('#<%=txtEmail.ClientID %>').css({ "background-color": "" });
                else {
                    $('#<%=txtEmail.ClientID %>').css({ "background-color": "#FD5E53" });
                    return false;
                }
            });
        });  
    </script>

The Output:
JQuery_Email_Address_Validation_Ext_Asp.net_Csharp_VB.net

Download Code Example C#        Download Code Example VB.Net

Posted in .Net, Asp.net, C#, Client, JQuery, VB.Net

Leave a Reply

Your email address will not be published. Required fields are marked *

     

*