AutoComplete using WebServices in asp.net using C#

Here i am going to show you, how to use AutoComplete using webservices in asp.net, C# and jquery...

OutPutt : 

• Create a project in vs 2008/2010/2012
• Add a new page and name it as your requirement
• Download JQuery from Here and JQuery-UI from Here or Demo from this POST
• Add files to the SolutionExplorer (See the Demo)
• Drag and Drop the files from the SolutionExplorer

    <link href="Styles/jquery-ui-1.9.1.custom.min.css" rel="stylesheet" type="text/css" />
    <script src="Scripts/jquery-1.8.2.min.js" type="text/javascript"></script>   
    <script src="Scripts/jquery-ui-1.9.1.custom.min.js" type="text/javascript"></script>

• Note : With Out  JQueryUI this wont work
• Now add the script as shown below and change the control names as required

    <script type="text/javascript">
        $(document).ready(function () {
            $("#<%=txtCountry.ClientID %>").autocomplete({
                source: function (request, response) {
                    $.ajax({
                        url: '<%=ResolveUrl("~/AutoCompleteSearch.asmx/GetCountryNames") %>',
                        data: "{ 'val': '" + request.term + "'}",
                        dataType: "json",
                        type: "POST",
                        contentType: "application/json; charset=utf-8",
                        success: function (data) {
                            response($.map(data.d, function (item) {
                                return {
                                    label: item
                                }
                            }))
                        },
                        error: function (response) {
                            alert(response.responseText);
                        },
                        failure: function (response) {
                            alert(response.responseText);
                        }
                    });
                },               
                minLength: 1
            });
        });
    </script> 

• Content page looks as shown below 

    <asp:Content ID="BodyContent" runat="server" ContentPlaceHolderID="MainContent">
       <p>       
           Country Name :&nbsp;
           <asp:TextBox ID="txtCountry" runat="server"></asp:TextBox>
       </p>
    </asp:Content>

•  Add a New .asmx page & name it as U like, in my case AutoCompleteSearch.asmx
• The code in the AutoCompleteSearch.asmx page looks as shown below

using System;
using System.Collections;
using System.ComponentModel;
using System.Data;
using System.Linq;
using System.Web;
using System.Web.Services;
using System.Web.Services.Protocols;
using System.Xml.Linq;
using System.Web.Script.Services;
using System.Collections.Generic;
using System.Data.SqlClient;
using System.Configuration;
 
namespace AutoComplete
{   
    [WebService(Namespace = "http://tempuri.org/")]
    [WebServiceBinding(ConformsTo = WsiProfiles.BasicProfile1_1)]
    [ToolboxItem(false)]
    [System.Web.Script.Services.ScriptService]
    public class AutoCompleteSearch : System.Web.Services.WebService
    {
        public AutoCompleteSearch()
        {
            //Uncomment the following line if using designed components 
            //InitializeComponent(); 
        }
 
        [WebMethod]
        [ScriptMethod(ResponseFormat = ResponseFormat.Json)]
        public string[] GetCountryNames(string val)
        {
            List<string> countryes = new List<string>();
            
            using (SqlConnection conn = new SqlConnection())
            {
                conn.ConnectionString = ConfigurationManager.ConnectionStrings["Constring"].ConnectionString;
                using (SqlCommand cmd = new SqlCommand())
                {
                    cmd.CommandText = "select CountryName from Countryes where CountryName like '" + val + "' + '%'";
                    cmd.Connection = conn;
                    conn.Open();
                    using (SqlDataReader sdr = cmd.ExecuteReader())
                    {
                        while (sdr.Read())
                        {
                            countryes.Add(string.Format("{0}", sdr["CountryName"]));
                        }
                    }
                    conn.Close();
                }
                return countryes.ToArray();
            }            
        }
    }
}

Download from HERE