AJAX AUTOCOMPLETED

Code for AJAX AUTOCOMPLETED

----------------.aspx--------------

<asp:TextBox ID="txt_Narration" runat="server" Width="200px" OnTextChanged="txt_Narration_TextChanged"
AutoPostBack="true">
</asp:TextBox>&nbsp;
<div id="div_NARRATION">
</div>
<cc1:AutoCompleteExtender runat="server" ID="AutoComplete_NARRATION" BehaviorID="autoCompleteNARRATION"
TargetControlID="txt_Narration" ServicePath="~/webservices/CommonWebService.asmx"
ServiceMethod="Get_Narration" MinimumPrefixLength="1" CompletionInterval="10"
EnableCaching="true" CompletionSetCount="12" CompletionListCssClass="AutoExtender"
CompletionListItemCssClass="AutoExtenderList" CompletionListHighlightedItemCssClass="AutoExtenderHighlight"
CompletionListElementID="div_NARRATION">
</cc1:AutoCompleteExtender>

.CSS

.AutoCompleteExtender_CompletionList
{
font-size: small;   
visibility:hidden;
padding : 1px;
Height:230px;
width:250px;
z-index:5000;
cursor:default;
margin:0px!important;
border:buttonshadow;
list-style-type:none;
overflow:auto;
text-align:left;
border-width:1px;
border-style:solid;
border-color:Maroon;
}

.AutoExtender
{

font-family: Verdana, Helvetica, sans-serif;
font-size: .8em;
font-weight: normal;
border: solid 1px #006699;
line-height: 20px;
padding: 10px;
background-color: White;
margin-left:0px;
z-index:5000;
}
.AutoExtenderList
{
border-bottom: dotted 1px #006699;
cursor: pointer;
color: Maroon;
z-index:5000;
}
.AutoExtenderHighlight
{
color: White;
background-color: #006699;
cursor: pointer;
z-index:5000;
}
#divwidth
{
z-index:500;
width: 200px !important;  
text-align:Left; 
}
#divwidth div
{
z-index:500;
text-align:Left;
width: 200px !important;  

}


.webservices

using System;
using System.Web;
using System.Collections;
using System.Web.Services;
using System.Web.Services.Protocols;
using System.Data;
using System.Configuration;
using System.Diagnostics;
using System.Web.Security;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Web.UI.WebControls.WebParts;
using System.Web.UI.HtmlControls;
using System.Windows.Forms;
using System.Data.SqlClient;
using System.Web.Script.Services;
using System.Xml;
using System.Collections.Generic;
/// <summary>
/// Summary description for CommonWebService
/// </summary>
[WebService(Namespace = "http://tempuri.org/")]
[WebServiceBinding(ConformsTo = WsiProfiles.BasicProfile1_1)]
[System.Web.Script.Services.ScriptService]

ConnectionStringSettings css = ConfigurationManager.ConnectionStrings["cnnGPTERP_IBM"];
SqlConnection sqlcnGPTERP;
SqlDataAdapter da;
DataTable dt;








[WebMethod]
public string[] Get_Narration(string prefixText)
{
//int count = 10;
sqlcnGPTERP = new SqlConnection(css.ConnectionString);
string sql = "select  narr_code, narrat_name from narration  where  (narrat_name like @prefixText or narr_code like @prefixText) order by  narrat_name";
SqlDataAdapter da = new SqlDataAdapter(sql, sqlcnGPTERP);
da.SelectCommand.Parameters.Add("@prefixText", SqlDbType.VarChar, 50).Value = prefixText + "%";
DataTable dt = new DataTable();
da.Fill(dt);
string[] items = new string[dt.Rows.Count];
int i = 0;
foreach (DataRow dr in dt.Rows)
{
items.SetValue(dr["narrat_name"].ToString() + " { " + dr["narr_code"].ToString() + " }", i);
i++;
}
return items;
    }