Post
Ask Question

Search Data from Database using Auto Complete Functionality

Method for Search data from database from TextBox with auto complete functionality. 
  1. [WebMethod]  
  2.    public static List<string> GetEmployeeName(string userName)  
  3.    {  
  4.        List<string> srchResult = new List<string>();  
  5.        using (SqlConnection con = new SqlConnection(ConfigurationManager.ConnectionStrings["constring"].ConnectionString))  
  6.        {  
  7.            using (SqlCommand cmd = new SqlCommand())  
  8.            {  
  9.                cmd.CommandText = "select userName from Credentials where userName LIKE ''+@SearchusrName+'%'";  
  10.                cmd.Connection = con;  
  11.                con.Open();  
  12.                cmd.Parameters.AddWithValue("@SearchusrName", userName);  
  13.                SqlDataReader dr = cmd.ExecuteReader();  
  14.                while (dr.Read())  
  15.                {  
  16.                    empResult.Add(dr["userName"].ToString());  
  17.                }  
  18.                con.Close();  
  19.                return srchResult;  
  20.   
  21.            }  
  22.        }  
  23.    }  
HTTP POST
  1. $(document).ready(function () {  
  2.             SearchUserName();  
  3.         });  
  4.         function SearchUserName() {  
  5.             $("#txtEmpName").autocomplete({  
  6.                 source: function (request, response) {  
  7.                     $.ajax({  
  8.                         type: "POST",  
  9.                         contentType: "application/json; charset=utf-8",  
  10.                         url: "Default.aspx/GetEmployeeName",  
  11.                         data: "{'userName':'" + document.getElementById('txtEmpName').value + "'}",  
  12.                         dataType: "json",  
  13.                         success: function (data) {  
  14.                             response(data.d);  
  15.                         },  
  16.                         error: function (result) {  
  17.                             alert("No Match found !");  
  18.                         }  
  19.                     });  
  20.                 }  
  21.             });  
  22.         }