ASP.NET Email Validation Using JQuery


In these Tutorials we see how to validate email address in asp.net by using JQuery and in my previous article i explained about How to Validate Password and Confirm Password by Using JQuery and another article is How to Show and Hide Div Tag based on RadiobuttonList Click using JQuery and Javascript. . In these Validation we see 3 statement, they are

  1. Please Enter Email-ID
  2. these error occurs when you leave textbox without entering any values in it.

  3. Please Enter Correct Email-ID
  4. these error occurs whenever you enter text without symbol's [ @ ] (or) [ . ]
    for example : 1. abc 2. abc@xyz

  5. Thank for Enter Correct Email-ID

HTML Markup : Create TextBox for Email validation

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Email Address Validation.aspx.cs" Inherits="JQUERY_TUTORIALS_Email_Address_Validation" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">    

 -------      ADD JQuery Code Here           --------

</head>
<body>
    <form id="form1" runat="server">
    <div>
    <table>
     <tr>
      <td><asp:textbox ID="txtemailID" runat="server"></asp:textbox></td>
     </tr>
     <tr>
      <td><asp:Label ID="lblemailID"
        runat="server" Text=""></asp:Label></td>
     </tr>
    </table>    
    </div>
    </form>
</body>
</html>

JQuery Validation for Email ID

 <script type="text/javascript">
        $(document).ready(function () {
            $('[id$=txtemailID]').focusout(function () {
                if ($('[id$=txtemailID]').val() == "") {
                    $('[id$=lblemailID]').html("Please enter Email ID");
                }
                if ($('[id$=txtemailID]').val() != "") {
                    var email = $('[id$=txtemailID]').val();
                    var filter = /\w+([-+.']\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*/;
                    if (filter.test(email)) {
                        $('[id$=lblemailID]').html("thank for entering Correct Email ID");
                    }
                    else {
                        $('[id$=lblemailID]').html("Please Enter Correct Email-ID Format { abc@xyz.com } ");
                    }
                    return false;
                }
            });
        });
    </script>
0 Komentar untuk "ASP.NET Email Validation Using JQuery"

Back To Top