Email: Password:       Forgot Password 
A Saarsha Group Online Community for dot net codes group like C#, Asp.NET, VB.NET, Sharepoint, JavaScript, JQuery, Ajax, SQL, WCF, WPF.

Autocomplete textbox in using jQuery

Viewed:  2296 
Posted On:  08/10/2014 11:03:39 
How we can implement autocomplete text box in using jQuery ? 

Here in this article I am going to explain how we can implement Autocomplete text box in ASP.NET using jQuery.

Below is my Data Table from which I am showing Employee Name:


Image 1.

Records in my Data Table are:

Here I will show Employee Name as autocomplete text box


Image 2.

Now my aspx code is:

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "">
<html xmlns="">
<head runat="server">
    <title>AutoComplete Text Box using jQuery in ASP.NET</title>
    <link href="jquery-ui.css" rel="stylesheet" type="text/css" />
    <script src="jquery.min.js" type="text/javascript"></script>
    <script src="jquery-ui.min.js" type="text/javascript"></script>
    <script type="text/javascript">
        $(document).ready(function() {
                source: function(request, response) {
                        type: "POST",
                        contentType: "application/json; charset=utf-8",
                        url: "Default.aspx/GetEmployeeName",
                        data: "{'empName':'" + document.getElementById('txtEmpName').value + "'}",
                        dataType: "json",
                        success: function(data) {
                        error: function(result) {
                            alert("No Match");
    <form id="form1" runat="server">
    <table cellpadding="10" cellspacing="10" style="border: solid 15px Green; background-color: SkyBlue;"
        width="50%" align="center">
                <span style="color: Red; font-weight: bold; font-size: 18pt;">Enter Employee Name:</span>&nbsp;
                <asp:TextBox ID="txtEmpName" runat="server" Width="160px" />
Now my aspx.cs code is:

using System;
using System.Configuration;
using System.Data;
using System.Linq;
using System.Web;
using System.Web.Security;
using System.Web.UI;
using System.Web.UI.HtmlControls;
using System.Web.UI.WebControls;
using System.Web.UI.WebControls.WebParts;
using System.Xml.Linq;
using System.Web.Services;
using System.Data.SqlClient;
using System.Collections.Generic;
public partial class _Default : System.Web.UI.Page
    protected void Page_Load(object sender, EventArgs e)
    public static List<string> GetEmployeeName(string empName)
        List<string> empResult = new List<string>();
        using (SqlConnection con = new SqlConnection(@"Data Source=MyPC\SqlServer2k8;Integrated Security=true;Initial Catalog=Test"))
            using (SqlCommand cmd = new SqlCommand())
                cmd.CommandText = "select Top 10 EmployeeName from Employee where EmployeeName LIKE ''+@SearchEmpName+'%'";
                cmd.Connection = con;
                cmd.Parameters.AddWithValue("@SearchEmpName", empName);
                SqlDataReader dr = cmd.ExecuteReader();
                while (dr.Read())
                return empResult;
Now Run the Application:

Here type some letter and see Employee Name List:


Image 3.


Image 4.

         HOME   |   Submit Article   |   Contact Us   |   About Us   |   Terms & Condition   |   Advertise With us