ASP.NET AJAX Auto Complete Extender with Database

Of late, there has been a lot of speculation about AJAX Control Toolkit's AutoComplete Extender. Basically , this control loads the data specific to the entered text..
So now we will see as to how to connect this control to database and fetch the data when the user enters a specific word or phrase.....

AutoComplete.aspx


 

 

Now let us see the code for web service that will help us in fetching the data..

AutoComplete.cs

[WebService(Namespace = "http://tempuri.org/")]
[WebServiceBinding(ConformsTo = WsiProfiles.BasicProfile1_1)]
[System.Web.Script.Services.ScriptService]
public class AutoComplete : WebService
{
[WebMethod]

public string[] SearchDB(string prefixText, int count)
{
if (count == 0)
{
count = 10;
}

SqlConnection con = new SqlConnection("server=localhost;database=your database;uid=your username;pwd=your pwd");

string str = "select * from table where username like @prefixText";
con.Open();
SqlDataAdapter da = new SqlDataAdapter(str, con);

da.SelectCommand.Parameters.Add("@prefixText", SqlDbType.VarChar, 50).Value = prefixText + "%";
DataSet ds = new DataSet();
da.Fill(ds);

int cnt = ds.Tables[0].Rows.Count;
List items = new List(cnt);
for (int i = 0; i < ds.Tables[0].Rows.Count; i++)
{


items.Add(ds.Tables[0].Rows[i]["UserName"].ToString());
}
return items.ToArray();

}
}


Stylesheet.css
/* AutoComplete highlighted item */

.autocomplete_highlightedListItem
{
background-color: #ffff99;
color: black;
padding: 1px;
}

/* AutoComplete item */

.autocomplete_listItem
{
background-color : window;
color : windowtext;
padding : 1px;
}

Now let's check out the result after running the application ..

 

 

 


NOTE:Please do comment regarding the article as it'll help me to write even more specifically..


Tags: , , , , , ,
Categories: ASP.NET

40 Comments
Actions: E-mail | Permalink | Comment RSSRSS comment feed

 


© Copyright 2009. www.onlineasp.net All Rights Reserved.