代码改变世界

Ajax Toolkit AutoComplete 几种用法

  时空印记  阅读(1991)  评论(0编辑  收藏  举报

AutoComplete控件是微软提供的 AJAX Control Toolkit 控件,是用来实现类似google 自动匹配和完成效果。

AutoComplete控件的用法很简单,只需要页面一个TextBox 和 一个 WebService方法就搞定,比写一大堆的JS+.ashx处理省了一堆的时间。

首先WebService,WebService其实就是用来提供AutoComplete可以使用的数据的,它可以有两种格式,一种是两个参数,另一个是三个参数,它们的返回值均为string[]类型。

public string[] ServiceMethod (string prefixText, int count)
public string[] ServiceMethod (string prefixText, int count,string contextKey)

两个参数的比较简单,博客园也写了一堆。

我们说下关于第三个参数的这个方法,contextKey 参数,可以接受我们自定义传值,比如有时候我用到了下拉框类别的时候,这个还是非常有用的 事例如下:

js:

复制代码
<script language="javascript" type="text/javascript">
function txtKeyDown() {
var ddlGrpId = document.getElementById("<%=ddlGroupName.ClientID %>");
var aceId = "<%=AutoCompleteExtender1.ClientID %>";
var aceName = $find(aceId);
if (aceName != null)
aceName.set_contextKey(ddlGrpId.options[ddlGrpId.selectedIndex].value);
}
</script>
复制代码

注意:

1.js 函数的最后一句,即在回传之前,设置它的值。

 2.注意 $find(aceId) 和aceName.set_contextKey(ddlGrpId.options[ddlGrpId.selectedIndex].value) 中set_contextKey的方法一定不能错,就如同它WebService方法的参

一样名称和方法的名称可以自己随便起,但参数名称是规定的,错了就夭折了哈。

aspx:

复制代码
 <td class="ControlTD" style="width: 200px; height: 19px;">
<asp:ScriptManagerProxy ID="ScriptManager2" runat="server">
<Services>
<asp:ServiceReference Path="~/WebService/AutoComplete.asmx" />
</Services>
</asp:ScriptManagerProxy>
<asp:TextBox ID="txtPatient" runat="server" autoComplete="off" MaxLength="25" onkeydown="return txtKeyDown();" TabIndex="1" Width="194px"></asp:TextBox>
<ajaxToolkit:AutoCompleteExtender ID="AutoCompleteExtender1" runat="server" ServicePath="~/WebService/AutoComplete.asmx" ServiceMethod="GetPatients"
MinimumPrefixLength
="1" TargetControlID="txtPatient" CompletionInterval="300" CompletionSetCount="5">
</ajaxToolkit:AutoCompleteExtender>
</td>
复制代码

你要是看 onkeydown="return txtKeyDown();" 这句不爽,你也可以后台注册txtPatient.Attributes.Add("onkeydown", "return txtKeyDown()");

completionInterval: 是用户录入后多长时间, 程序去调用服务来获取数据 单位是毫秒。

completionSetCount:指定一次应该返回多少项  默认10项

minimumPrefixLength:最少需要录入多少长度才执行匹配下拉。


WebService:

复制代码
        [WebMethod]
public string[] GetPatients(string prefixText,int count, string contextKey)
{
var selectUsers = new StringBuilder("select top 5 userName+'/'+userId as userinfo from ");
selectUsers.Append("userInfo where userType='0' and status='A' and grpId='"+contextKey+"' ");
selectUsers.Append(" and (userId like '" + prefixText + "%' or userName like '" + prefixText + "%')");
DataTable dt = dSqlHepler.ExeDataTable("text", selectUsers.ToString(), null, null, "", true);
dSqlHepler.Close();

if (dt != null && dt.Rows.Count > 0)
{
var items = new string[dt.Rows.Count];
int i = 0;
foreach (DataRow dr in dt.Rows)
{
items.SetValue(dr["userinfo"].ToString(), i);
i++;
}

return items;
}
else
{
var items = new string[1];
items.SetValue("No matching value", 0);

return items;
}
     }
复制代码


以上简单几步全搞定。

没搞定的是  在AutoCompleteExtender 下拉选项的事件控制,选择一项触发一个事件,有时候也很需要的。因为提供的没有这个玩意,所以需要的话,只能费手脚的去下它的源码修改

重新编译了。你有更好的办法?



编辑推荐:
· 如何编写易于单元测试的代码
· 10年+ .NET Coder 心语,封装的思维:从隐藏、稳定开始理解其本质意义
· .NET Core 中如何实现缓存的预热?
· 从 HTTP 原因短语缺失研究 HTTP/2 和 HTTP/3 的设计差异
· AI与.NET技术实操系列:向量存储与相似性搜索在 .NET 中的实现
阅读排行:
· 周边上新:园子的第一款马克杯温暖上架
· Open-Sora 2.0 重磅开源!
· .NET周刊【3月第1期 2025-03-02】
· 分享 3 个 .NET 开源的文件压缩处理库,助力快速实现文件压缩解压功能!
· Ollama——大语言模型本地部署的极速利器
点击右上角即可分享
微信分享提示