AutoCompleteExtender的使用 滚动条 样式

23 篇文章 0 订阅
17 篇文章 0 订阅

1、添加AutoCompleteExtender控件,和TextBox控件
2、创建WebServer服务方法,并加入下面代码:
[WebMethod]
public string[] GetCompletionList(string prefixText,int count)
{
int index = 0;
string connectionString = ConfigurationManager.ConnectionStrings["ConnectionString"].ConnectionString;
string strSQL = "SELECT USER_ID FROM USERINFO WHERE USER_ID LIKE '" + prefixText + "%'";
OleDbConnection connection = new OleDbConnection(connectionString);
OleDbDataAdapter dda = new OleDbDataAdapter(strSQL,connectionString);
DataSet ds = new DataSet();
dda.Fill(ds);

DataTable dt = ds.Tables[0];
List<string> items = new List<string>(count);
foreach (DataRow dr in dt.Rows)
{
string strID = dr["USER_ID"].ToString();
if (index < count && index < dt.Rows.Count)
{
items.Add(strID);
}
index++;
}
return items.ToArray();
}

3、在web.config中加入连接数据库字符串配置:
<connectionStrings>
< add name="ConnectionString" connectionString="Provider=OraOLEDB.Oracle;Data Source=oracts;user id=bugdr;password=bugdr;"/>
< /connectionStrings>

4、编写HTML代码,如下:
<asp:TextBox runat="server" ID="myTextBox" Width="300" autocomplete="off" />
< ajaxToolkit:AutoCompleteExtender
runat="server"
BehaviorID="AutoCompleteEx"
ID="autoComplete1"
TargetControlID="myTextBox"
ServicePath="AutoComplete.asmx"
ServiceMethod="GetCompletionList"
MinimumPrefixLength="2"
CompletionInterval="1000"
EnableCaching="true"
CompletionSetCount="20"
CompletionListCssClass="autocomplete_completionListElement"
CompletionListItemCssClass="autocomplete_listItem"
CompletionListHighlightedItemCssClass="autocomplete_highlightedListItem"
DelimiterCharacters=";, :">

5、添加CSS样式表
/*AutoComplete flyout */
.autocomplete_completionListElement

visibility : hidden;
margin : 0px!important;
background-color : inherit;
color : windowtext;
border : buttonshadow;
border-width : 1px;
border-style : solid;
cursor : 'default';
overflow : auto;
height : 200px;
text-align : left;
list-style-type : none;
}

/* AutoComplete item */
.autocomplete_listItem
{
background-color : window;
color : windowtext;
padding : 1px;
}

/* AutoComplete highlighted item */
.autocomplete_highlightedListItem
{
background-color: #ffff99;
color: black;
padding: 1px;
}

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值