自动完成服务端控件开发(1)

本文介绍如何使用自动完成控件实现根据输入内容自动从后台查询相关数据的功能,包括添加引用、设置属性与事件、编写代码以及客户端扩展等步骤。通过实例演示,展示如何在网页中实现实时搜索功能。

前一段时间由于项目需要搜索时要根据输入的内容自动从后台查询与之相关的数据,先上图看一看最终的效果:

image

这篇主要先介绍一下如何使用这个控件。

1.添加对DSKJ.Controls.DLL程序集的引用
  image
  引用后控件自动加入到工具箱中.
   image
2.属性和事件

属性
TargetControl
设置与此控件关联的TextBox控件ID

Opacity
设置或获取自动提示显示时的透明度,取值1至100

OnClientCompleted
获取或设置选择完成后在客户执行的客户端JavaScript脚本

Items
列表项目集合

DataTextField
获取或设置数据项显示的文本(字段或属性名)

DataValueField
获取或设置数据项值(字段或属性名)

DataHideField
获取或设置隐藏项值(字段或属性名)

事件
AsyncDataBind
异步数据绑定事件

3.设置属性的截图

        image

image

image  

4. 编写事件
    AsyncDataBind异步数据绑定事件,在此事件中进行数据的获取并进行数据的绑定操作;前端的参数将通过AysncDataBindEventArgs类型的参数传递的,此类型参数有一个ObjectArgs的String类型的属性;

protected void AutoCompleteExtender1_AsyncDataBind(object sender, DSKJ.Web.UI.WebControls.AsyncDataBindEventArgs e)
{
string _Keyword = e.ObjectArgs.Trim();
if (_Keyword.Trim() != string.Empty)
{
string _CommandText = string.Format(" Select top 10 * From DZ_Customers Where CustomerName like '%{0}%' ", _Keyword.Trim());
DataTable _DT = ExecuteTable(_CommandText);
AutoCompleteExtender1.DataSource = _DT;
AutoCompleteExtender1.DataBind();
}
}
5.客户端的扩展
   编写OnClientCompleted客户端完成事件.如下图:
       image
       会在客户端页面产生下面的JS脚本:其中AutoCompleteExtender1_obj为自动完成控件注册在客户端的ID;
       function OnCompleted(t,v,hv) 参数说明:t:选中项的Text文本,v代表选中项的Value值,hv代表隐藏域的值
function AutoCompleteExtender1_obj_OnCompleted(t, v, hv) 
{
try
{
document.getElementById('TextBox2').value = t; //此为在设计时写入的脚本,此意为将显示的文本赋值给名为TextBox2的文本框中
}
catch (err)
{
alert('执行出现异常:' + err.description)
}
}
源码下载:DSKJ.Controls.DLL
未完待续,下节将对控件类进行介绍.

转载于:https://www.cnblogs.com/kevin-wang/archive/2010/05/24/1742720.html

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值