How to check whether username exists in database without refreshing page using ajax

Imteyazkhan374
Posted by in ASP.NET AJAX category on for Beginner level | Points: 250 | Views : 31725 red flag

In this article we will see how to check whether username exists in database or not without refreshing the page using ajax updatepanel control.


 Download source code for How to check whether username exists in database without refreshing page using ajax

Introduction

Hello,

In this article we will see how to check whether username exists in database or not without refreshing the page using ajax updatepanel control.  When user wants to register on any site, then it is must to get a unique username. This one is so exiting because user don’t need to press button after filling the full form to check whether username exists or not but it will show same just after losing focus from textbox after entering username.




Objective


 Fetching username from database and matches if it exists or not and give appropriate message to user



Using the code


How to use code:

1. Open Visual Studio 2010 -> Create New Website

2. Add a Webform and drag and drop 1 updatepanel, 1 scriptmanager, 1 textbox, 1 label and 1 image control

3. Change ID of textbox from TextBox1 to txtusername, Label1 to lblmessage and Image1 to Imagemessage

4. Once the user presses tab key after entering username in textbox, a message will appear either "username already exist" or "You can choose this username".

5. Add two image file named available.gif and notavailable.jpg by just right click on the application and choose add existing items and select the image file




Tables and codes:

Create table logintable(username varchar(20),password varchar(20))
HTML Code:
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %>


<!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">
    <title></title>
</head>
<body>
    <form id="form1" runat="server">
    <div>
    
    </div>
    <asp:ScriptManager ID="ScriptManager1" runat="server">
    </asp:ScriptManager>
   
    

       <asp:UpdatePanel ID="UpdatePanel1" runat="server">
       <ContentTemplate>
    <asp:TextBox ID="txtusername" runat="server" 
        style="z-index: 1; left: 282px; top: 135px; position: absolute; height: 21px;" 
             ontextchanged="TextBox1_TextChanged" 
        AutoPostBack="True"></asp:TextBox>

    <asp:Label ID="lblmessage" runat="server" 
        style="z-index: 1; left: 474px; top: 138px; position: absolute; height: 19px; width: 203px" 
        Text="Label"></asp:Label>
        <asp:Image ID="Imagemessage" runat="server" Height="17px" 
        style="z-index: 1; left: 445px; top: 138px; position: absolute; height: 20px; width: 24px" 
        Width="17px" />
        </ContentTemplate>
        </asp:UpdatePanel>
    
    </form>
</body>
</html>

C# Code:
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Data.SqlClient;
using System.Data;

public partial class _Default : System.Web.UI.Page
{
    protected void Page_Load(object sender, EventArgs e)
    {
        Imagemessage.Visible = false;
        lblmessage.Visible = false;
    }
    protected void TextBox1_TextChanged(object sender, EventArgs e)
    {
        if (Page.IsPostBack == true)
        {
            SqlConnection con = new SqlConnection("Data Source=.;Initial Catalog=mydatabase;Integrated Security=True");
            con.Open();
            SqlCommand cmd = new SqlCommand("select * from logintable where username='" + txtusername.Text + "'", con);
            SqlDataAdapter da = new SqlDataAdapter(cmd);
            DataSet ds = new DataSet();
            da.Fill(ds);
            if (ds.Tables[0].Rows.Count > 0)
            {
                Imagemessage.Visible = true;
                lblmessage.Visible = true;
                Imagemessage.ImageUrl = "NotAvailable.jpg";
                lblmessage.Text = "Username already exists.";
            }
            else
            {
                Imagemessage.Visible = true;
                lblmessage.Visible = true;
                Imagemessage.ImageUrl = "Available.gif";
                lblmessage.Text = "You can choose this username.";
            }
        }
    }
   
}

Screen 1: When Username exist:

Screen 2: When Username not exists:




Conclusion


I hope this will be helpful for those who wants to stop refreshing page and save time.



Page copy protected against web site content infringement by Copyscape

About the Author

Imteyazkhan374
Full Name: Imteyaz Ahmed
Member Level: Starter
Member Status: Member
Member Since: 4/25/2013 1:16:00 PM
Country: India

http://www.dotnetfunda.com
Currently working as a student and always try to innovate something new.

Login to vote for this post.

Comments or Responses

Posted by: Goud.Kv on: 3/14/2014 | Points: 25
That works fine.. Nice post
Posted by: Bhagatprasad8 on: 8/27/2014 | Points: 25
Dear sir,
same validation but using entity framework +asp.net
can u provide for me

Login to post response

Comment using Facebook(Author doesn't get notification)