博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
使用ASP.NET Atlas AutoComplete Behavior或AutoComplete Extender实现自动完成功能(下)
阅读量:6709 次
发布时间:2019-06-25

本文共 4115 字,大约阅读时间需要 13 分钟。

作者:Dflying Chen ( )
请同时参考:

让我们通过一个实例来测试上述两种方法:

首先,让我们建立一个词库,提供自动完成的列表。这个词库Copy自Atlas的官方文档示例,是一些.NET的常见术语。将其存为WordData.txt并置于App_Data目录下。

ContractedBlock.gif
ExpandedBlockStart.gif
Word List
None.gifaccess control list (ACL)
None.gifADO.NET
None.gifaggregate event
None.gifalpha channel
None.gifanchoring
None.gifantialiasing
None.gifapplication base
None.gifapplication domain (AppDomain)
None.gifapplication manifest
None.gifapplication state
None.gifASP.NET
None.gifASP.NET application services database
None.gifASP.NET mobile controls
None.gifASP.NET mobile Web Forms
None.gifASP.NET page
None.gifASP.NET server control
None.gifASP.NET Web application
None.gifassembly
None.gifassembly cache
None.gifassembly manifest
None.gifassembly metadata
None.gifassertion (Assert)
None.gifassociation class
None.gifASSOCIATORS OF
None.gifasynchronous method
None.gifattribute
None.gifauthentication
None.gifauthorization
None.gifautopostback
None.gifbounds
None.gifboxing
None.gifC#
None.gifcard
None.gifcatalog
None.gifCCW
None.gifchevron
None.gifchrome
None.gifcHTML
None.gifCIM
None.gifCIM Object Manager
None.gifCIM schema
None.gifclass
None.gifclient area
None.gifclient coordinates
None.gifclip
None.gifclosed generic type
None.gifCLR
None.gifCLS
None.gifCLS-compliant
None.gifcode access security
None.gifcode-behind class
None.gifcode-behind file
None.gifcode-behind page
None.gifCOM callable wrapper (CCW)
None.gifCOM interop
None.gifCommon Information Model (CIM)
None.gifcommon language runtime
None.gifcommon language runtime host
None.gifCommon Language Specification (CLS)
None.gifcommon object file format (COFF)
None.gifcommon type system (CTS)
None.gifcomparison evaluator
None.gifcomposite control
None.gifconfiguration file
None.gifconnection
None.gifconnection point
None.gifconstraint
None.gifconstructed generic type
None.gifconstructed type
None.gifconsumer
None.gifcontainer
None.gifcontainer control
None.gifcontent page
None.gifcontext
None.gifcontext property
None.gifcontract
None.gifcontrol state
None.gifcross-page posting
None.gifCTS
None.gifcustom attribute (Attribute)
None.gifcustom control

然后创建一个Web Service用来提供建议列表,其中逻辑不多讲了,大概是读入上面的词库并根据输入找出相关的词汇,注意一下GetWordList方法的签名。

ContractedBlock.gif
ExpandedBlockStart.gif
Suggestion Web Service Code
None.gifusing System;
None.gif
using System.IO;
None.gif
using System.Web;
None.gif
using System.Collections;
None.gif
using System.Collections.Generic;
None.gif
using System.Threading;
None.gif
using System.Web.Services;
None.gif
using System.Web.Services.Protocols;
None.gif
using System.Xml.Serialization;
None.gif
None.gif[WebService(Namespace 
= "http://tempuri.org/")]
None.gif[WebServiceBinding(ConformsTo 
= WsiProfiles.BasicProfile1_1)]
None.gif
public class AutoCompleteService : System.Web.Services.WebService
ExpandedBlockStart.gifContractedBlock.gif
dot.gif{
InBlock.gif    
private static string[] autoCompleteWordList = null;
InBlock.gif
InBlock.gif    [WebMethod]
InBlock.gif    
public String[] GetWordList(string prefixText, int count)
ExpandedSubBlockStart.gifContractedSubBlock.gif    
dot.gif{
InBlock.gif        
// init the suggest list
InBlock.gif
        if (autoCompleteWordList == null)
ExpandedSubBlockStart.gifContractedSubBlock.gif        
dot.gif{
InBlock.gif            
string[] temp = File.ReadAllLines(Server.MapPath("~/App_Data/WordData.txt"));
InBlock.gif            Array.Sort(temp, 
new CaseInsensitiveComparer()); // sort for binary search
InBlock.gif
            autoCompleteWordList = temp;
ExpandedSubBlockEnd.gif        }
InBlock.gif
InBlock.gif        
int index = Array.BinarySearch(autoCompleteWordList, prefixText, new CaseInsensitiveComparer());
InBlock.gif        
if (index < 0)
ExpandedSubBlockStart.gifContractedSubBlock.gif        
dot.gif{
InBlock.gif            index 
= ~index;
ExpandedSubBlockEnd.gif        }
InBlock.gif
InBlock.gif        
int matchingCount;
InBlock.gif        
for (matchingCount = 0; matchingCount < count && index + matchingCount < autoCompleteWordList.Length; matchingCount++)
ExpandedSubBlockStart.gifContractedSubBlock.gif        
dot.gif{
InBlock.gif            
if (!autoCompleteWordList[index + matchingCount].StartsWith(prefixText, StringComparison.CurrentCultureIgnoreCase))
InBlock.gif                
break;
ExpandedSubBlockEnd.gif        }
InBlock.gif
InBlock.gif        String[] returnValue 
= new string[matchingCount];
InBlock.gif        
if (matchingCount > 0)
ExpandedSubBlockStart.gifContractedSubBlock.gif        
dot.gif{
InBlock.gif            Array.Copy(autoCompleteWordList, index, returnValue, 
0, matchingCount);
ExpandedSubBlockEnd.gif        }
InBlock.gif        
return returnValue;
ExpandedSubBlockEnd.gif    }
ExpandedBlockEnd.gif}

Web Service建立好之后您可以直接测试一下,如果一切正确,我们就继续编写Atlas页面。

首先,无论使用客户端AutoComplete Behavior还是服务器端AutoComplete Extender,一个ScriptManager都是必不可少的:

None.gif
<
atlas:ScriptManager 
runat
="server"
 ID
="scriptManager"
 
/>

如果使用客户端AutoComplete Behavior,首先需要书写一个HTML input:

None.gif
<
input 
id
="clientTextBox"
 type
="text"
 style
="width: 400px;"
 
/>

然后,相应的书写Atlas Script。请小心书写毕竟这里基本没有强大的IDE的支持。

None.gif
<
page 
xmlns:script
="http://schemas.microsoft.com/xml-script/2005"
>
None.gif   
<
components
>
None.gif       
<
textBox 
id
="clientTextBox"
>
None.gif           
<
behaviors
>
None.gif               
<
autoComplete 
None.gif                  
serviceURL
="AutoCompleteService.asmx"
None.gif                  serviceMethod
="GetWordList"
None.gif                  minimumPrefixLength
="2"
None.gif                  completionSetCount
="10"
None.gif                  completionInterval
="500"
 
/>
None.gif           
</
behaviors
>
None.gif       
</
textBox
>
None.gif   
</
components
>
None.gif
</
page
>

在使用服务器端AutoComplete Extender时,一切都非常简单,我们只需要添加一个服务器端TextBox和一个AutoComplete Extender即可:

None.gif
<
asp:TextBox 
ID
="serverTextbox"
 runat
="server"
 Width
="400px"
 
/>
None.gif
<
atlas:AutoCompleteExtender 
ID
="serverCompleteExtender"
 runat
="server"
>
None.gif    
<
atlas:AutoCompleteProperties 
Enabled
="true"
 MinimumPrefixLength
="2"
 TargetControlID
="serverTextbox"
None.gif        ServiceMethod
="GetWordList"
 ServicePath
="AutoCompleteService.asmx"
 
/>
None.gif
</
atlas:AutoCompleteExtender
>

至此为止,大功告成,让我们在浏览器中测试一下:

客户端AutoComplete Behavior:

autocomplete1.JPG

服务器端AutoComplete Extender:

autocomplete2.JPG

本实例程序的源代码可以在此下载:
你可能感兴趣的文章
lvs详细介绍
查看>>
ci框架hook钩子
查看>>
PHP Warning: PHP Startup: unable to load dynamic library
查看>>
Linux free命令详解
查看>>
备忘:修改windows远程桌面端口
查看>>
Python走一遍A-Z的字符串使用(九)
查看>>
metasploit(MSF)终端命令大全
查看>>
Linux下php安装Redis扩展
查看>>
sublime text2 汉化
查看>>
管理信息系统测试方法总结(二)
查看>>
HTML设置超链接的颜色样式
查看>>
EMC与NetApp NAS对比
查看>>
bash算数运算&命令引用
查看>>
OpenLDAP限制用户登录主机
查看>>
高斯滤波器平滑图像代码
查看>>
分布式爬虫技术架构
查看>>
计费程序(服务器)
查看>>
Javascript的冒泡排序和二分查找
查看>>
Unity优化
查看>>
Linux下常用的日志收集命令
查看>>