In this article I will explain with an example, how to check Email address availability i.e. check whether Email address exists in database or not using jQuery AJAX in ASP.Net with C# and VB.Net.
This article will illustrate how to check Email address availability in database on Registration Form by making AJAX call to database using jQuery AJAX in ASP.Net with C# and VB.Net.
 
 
Database
I have made use of the following table Users with the schema as follows.
Check Email Availability (Exists) in Database using jQuery AJAX in ASP.Net using C# and VB.Net
 
I have already inserted few records in the table.
Check Email Availability (Exists) in Database using jQuery AJAX in ASP.Net using C# and VB.Net
 
Note: You can download the database table SQL by clicking the download link below.
          Download SQL file
 
 
HTML Markup
The following HTML Markup consists of an HTML TextBox, an HTML Button and an HTML SPAN element.
The HTML TextBox has been assigned an onkeyup event handler which triggers the ClearMessage JavaScript function.
The HTML Button has been assigned an onclick event handler which triggers the CheckAvailability JavaScript function.
Email:
<input id="txtEmail" type="text" onkeyup="ClearMessage()" />
<input id="btnCheck" type="button" value="Show Availability" onclick="CheckAvailability()" />
<br />
<span id="message"></span>
 
 
Stored Procedure
The following Stored Procedure will be used to check whether the supplied Email address exists in the database or not.
It will return TRUE if the Email address does not exists in database i.e. it is available and it will return FALSE if the Email address exists in the database i.e. it is already in use.
SET ANSI_NULLS ON
GO
SET QUOTED_IDENTIFIER ON
GO
 
CREATE PROCEDURE [dbo].[CheckEmailAvailability]
      @Email NVARCHAR(50)
AS
BEGIN
      SET NOCOUNT ON;
      IF NOT EXISTS(SELECT UserName FROM Users
                    WHERE Email = @Email)
      BEGIN
            SELECT 'TRUE'
      END
      ELSE
      BEGIN
            SELECT 'FALSE'
      END
END
GO
 
 
Namespaces
You will need to import the following namespaces.
C#
using System.Data;
using System.Data.SqlClient;
using System.Configuration;
 
VB.Net
Imports System.Data
Imports System.Data.SqlClient
Imports System.Configuration
 
 
The Web Method
The following Web Method will be called from the Client side using jQuery AJAX function.
The Web Method calls the CheckEmailAvailability Stored Procedure and returns the value returned from the Stored Procedure back to the Client.
C#
[System.Web.Services.WebMethod]
public static bool CheckEmail(string email)
{
    bool status = false;
    string constr = ConfigurationManager.ConnectionStrings["conString"].ConnectionString;
    using (SqlConnection conn = new SqlConnection(constr))
    {
        using (SqlCommand cmd = new SqlCommand("CheckEmailAvailability", conn))
        {
            cmd.CommandType = CommandType.StoredProcedure;
            cmd.Parameters.AddWithValue("@Email", email.Trim());
            conn.Open();
            status = Convert.ToBoolean(cmd.ExecuteScalar());
            conn.Close();
        }
    }
    return status;
}
 
VB.Net
<System.Web.Services.WebMethod()> _
Public Shared Function CheckEmail(ByVal email As String) As Boolean
    Dim status As Boolean = False
    Dim constr As String = ConfigurationManager.ConnectionStrings("conString").ConnectionString
    Using conn As SqlConnection = New SqlConnection(constr)
        Using cmd As SqlCommand = New SqlCommand("CheckEmailAvailability", conn)
            cmd.CommandType = CommandType.StoredProcedure
            cmd.Parameters.AddWithValue("@Email", email.Trim())
            conn.Open()
            status = Convert.ToBoolean(cmd.ExecuteScalar())
            conn.Close()
        End Using
    End Using
    Return status
End Function
 
 
The Client Side PageMethod implementation
The CheckAvailability JavaScript function gets called when the Button is clicked, it first fetches the Email address to be checked for availability from the TextBox and then calls the WebMethod using the jQuery AJAX function.
When the response is received, based on whether the Email address is available or in use, appropriate message is displayed in the HTML SPAN element.
The ClearMessage JavaScript function gets called when user types in the TextBox, it simply clears the message displayed in the HTML SPAN element.
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<script type="text/javascript">
    function CheckAvailability() {
        var email = $("#txtEmail").val();
        $.ajax({
            type: "POST",
            url: "Default.aspx/CheckEmail",
            data: '{email: "' + email + '" }',
            contentType: "application/json; charset=utf-8",
            dataType: "json",
            success: function (response) {
                var message = $("#message");
                if (response.d) {
                    //Email available.
                    message.css("color", "green");
                    message.html("Email is available");
                }
                else {
                    //Email not available.
                    message.css("color", "red");
                    message.html("Email is NOT available");
                }
            }
        });
    };
 
    function ClearMessage() {
        $("#message").html("");
    };
</script>
 
 
Screenshot
Check Email Availability (Exists) in Database using jQuery AJAX in ASP.Net using C# and VB.Net
 
 
Demo
 
 
Browser Compatibility

The above code has been tested in the following browsers.

Internet Explorer  FireFox  Chrome  Safari  Opera 

* All browser logos displayed above are property of their respective owners.

 
 
Downloads