In this article I will explain with an example, how to check UserName availability i.e. check whether UserName exists in database or not using jQuery AJAX in ASP.Net with C# and VB.Net.
This article will illustrate how to check UserName 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 UserName Availability in ASP.Net using jQuery
 
I have already inserted few records in the table.
Check UserName Availability in ASP.Net using jQuery
 
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:
TextBox – For capturing UserName.
The HTML TextBox has been assigned with an onkeyup JavaScript function which triggers the ClearMessage JavaScript function.
Button – For checking availability of entered UserName.
The HTML Button has been assigned an onclick event handler which triggers the CheckAvailability JavaScript function.
SPAN – For displaying success or error message.
Username:
<input id="txtUsername" 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 UserName exists in the SQL Server database or not.
It will return TRUE if the UserName does not exists in SQL Server database i.e. it is available and it will return FALSE if the UserName exists in the SQL Server database i.e. it is already in use.
 
SET ANSI_NULLS ON
GO
SET QUOTED_IDENTIFIER ON
GO
 
CREATE PROCEDURE [dbo].[CheckUserAvailability]
      @UserName VARCHAR(50)
AS
BEGIN
      SET NOCOUNT ON;
      IF NOT EXISTS(SELECT UserName FROM Users
                           WHERE UserName = @UserName)
      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;
using System.Web.Services;
 
VB.Net
 
Imports System.Data
Imports System.Data.SqlClient
Imports System.Configuration
Imports System.Web.Services
 
 
Client Side PageMethod implementation
When the Button is clicked, the CheckAvailability JavaScript function gets called.
It fetches the UserName from the TextBox to be checked for availability and then calls the WebMethod using the jQuery AJAX function.
When the response is received, based on whether the UserName is available or in use, an appropriate message is displayed using 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://cdnjs.cloudflare.com/ajax/libs/jquery/3.7.1/jquery.min.js"></script>
<script type="text/javascript">
    function CheckAvailability() {
        var username = $("#txtUsername").val();
        $.ajax({
            type: "POST",
            url: "Default.aspx/CheckUserName",
            data: '{username: "' + username + '" }',
            contentType: "application/json; charset=utf-8",
            dataType: "json",
            success: function (response) {
                var message = $("#message");
                if (response.d) {
                    //Username available.
                    message.css("color", "green");
                    message.html("Username is available");
                }
                else {
                    //Username not available.
                    message.css("color", "red");
                    message.html("Username is NOT available");
                }
            }
        });
    };
 
    function ClearMessage() {
        $("#message").html("");
    };
</script>
 
 
Server Side WebMethod implementation
 
The CheckUserName WebMethod will be called from the Client side using jQuery AJAX function.
The WebMethod calls the CheckUserAvailability Stored Procedure and returns the value returned from the Stored Procedure back to the Client.
C#
 
[WebMethod]
public static bool CheckUserName(string username)
{
    bool status = false;
    string constr = ConfigurationManager.ConnectionStrings["constr"].ConnectionString;
    using (SqlConnection conn = new SqlConnection(constr))
    {
        using (SqlCommand cmd = new SqlCommand("CheckUserAvailability", conn))
        {
            cmd.CommandType = CommandType.StoredProcedure;
            cmd.Parameters.AddWithValue("@UserName", username.Trim());
            conn.Open();
            status = Convert.ToBoolean(cmd.ExecuteScalar());
            conn.Close();
        }
    }
    return status;
}
 
VB.Net
<WebMethod()> _
Public Shared Function CheckUserName(ByVal username As String) As Boolean
    Dim status As Boolean = False
    Dim constr As String = ConfigurationManager.ConnectionStrings("constr").ConnectionString
    Using conn As SqlConnection = New SqlConnection(constr)
        Using cmd As SqlCommand = New SqlCommand("CheckUserAvailability", conn)
            cmd.CommandType = CommandType.StoredProcedure
            cmd.Parameters.AddWithValue("@UserName", username.Trim())
            conn.Open()
            status = Convert.ToBoolean(cmd.ExecuteScalar())
            conn.Close()
        End Using
    End Using
    Return status
End Function
 
 
Screenshot
Check UserName Availability in ASP.Net using jQuery
 
 
 
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.
 
 
Demo
View Demo
 
 
Downloads
Download Code