【中英文】ASP.Net中英文复合检索文本框实现思路及代码-检索-文本框

欢迎您访问我爱IT技术网，今天小编为你分享的编程技术是：【ASP.Net中英文复合检索文本框实现思路及代码】，下面是详细的讲解！

ASP.Net中英文复合检索文本框实现思路及代码

前段时间，写一个用户部门的管理页面，需要对后台获取的用户数据实现英汉检索功能。　

同时，选定一个选项之后，需要触发事件与后台交互，将该用户所在的部门显示到页面右边的ListBox控件中。

一、Dojo的FilteringSelect组件实现拼音检索功能

在网上有不少相关的介绍，其中比较经典的有"海盗乱语"的关于重写Dojo的FilteringSelect组件实现拼音检索功能的介绍（地址http://cosbor.web-144.com/?p=38、http://cosbor.web-144.com/?p=52）。由于作者的Demo后台以及pinyin4j的jar包都是基于Java平台的，本人花了一点时间将其实现在.Net平台下，并成功的实现了FilteringSelect选中事件的注册。实现原理请详细参考"海盗乱语"博客中的分析，这里对.Net平台下的实现思路做简要说明，并贴出源码供大家参考（在此对作者提供的思路表示感谢！）：

首先，引入Dojo工具包，在dojo目录下添加一个"test"文件夹，新建一个FilteringSelect.js文件，如下图：

FilteringSelect.js文件的作用是重写FilteringSelect组件，"海盗乱语"的博文中给出了的代码清单，为方便起见转贴如下：

然后，新建一个WebForm页面，放置一个FilteringSelect控件，数据源取值为页面类继承过来的userListstr字段，页面前台代码如下：　

最后，在页面加载事件中获取用户数据，序列化之后，赋给protected类型的userListstr字段。其中这里引用到微软提供的获取汉字拼音的类库ChnCharInfo.dll,代码请单如下：

这样拼音检索的功能就完成了。不过有两点不尽人意的地方：1.使用拼音检索后，不好再使用中文检索，2.网上查了很久，没有选中项改变事件介绍，代码中只是注册了一个失去焦点事件，在与后台交互方面不太方便（可能是本人对dojo事件不熟，欢迎对dojo api有研究的大侠指点）。

二、JqueryUI的autocomplete插件实现拼音检索功能

其实JqueryUI也提供了一个非常好用的插件--autocomplete，它与ChnCharInfo.dll类库配合使用，不仅能实现同样优秀的检索功能，而且能够很好的解决上述两个问题。不妨来看看：

需要用到的相关组件和引用的类库：Jquery-UI 、汉字拼音转换语言包类库ChnCharInfo .dll和Json对象序列化类库Newtonsoft.Json.dll，如下所示：

1.WebForm的aspx页面实现：

首先引入jquery-1.8.2.js、jquery-ui-1.9.0.custom.js、jquery-ui-1.9.0.custom.css，然后在页面加载完成的事件中写如下脚本：

其中第4行的 source: "GetUser.ashx",是指键入字符后，发送异步请求的地址，GetUser.ashx负责向请求的客户端提供满足Json格式的用户信息；第5行的minLength: 是输入到几个字符时开始发送异步请求；第7行的select: function(event, ui){}即选中事件，ui.item表示被选中的项；第8-9行的隐藏域存值，是为了页面刷新后能重新获取该选中项的相关信息，重新写回页面以备用；第10-11行以当前选中项的id和label被为参数向OrgRelation.aspx发送post请求，是实现将选中用户的所在部门查询处来，显示到页面右侧的ListBox控件中，其服务端实现与本次讨论的内容无关，代码就不贴出来了。

页面的完整代码清单如下：

2.Global.asax中用户数据的准备

由于这里的用户数据不经常变化，考虑到搜索是需要频繁的向服务端请求数据，因此将用户数据存入了Application中，这样搜索时直接从Application中取，不用每次去数据库查询。

Application对象的赋值是在全局应用程序Global.asax的 Application_Start事件中完成的，代码如下：

获取用户信息的GetUser方法中，同时完成了拼音简码的获取，代码如下：

至于Application与数据库中数据的一致的考虑，可提供一个一般处理程序UpdateApplication.ashx负责更新Application(代码与Global.asax中基本相同)，当数据库发生变化时，访问UpdateApplication.ashx即可更新Application["Contact"]对象。

3.GetUser.ashx中返回符合检索条件的数据

GetUser.ashx中响应搜索事件的服务端代码清单如下：

第17行是获取文本框中输入的检索字符串inputstr，这里使用正则表达式对获取名称以inputstr开头的记录（中文检索）或者拼音简码以inputstr开头的记录（拼音检索）。如果需要模糊检索功能，可以修改第25行的正则表达式为：Regex reg=new Regex(inputStr);即可。如果需要更多字段的复合检索(例如用户手机号，邮箱地址等)，也只要Application对像赋值时获取相关的字段信息，在26行的if判断中增加相应匹配项即可。

其中UserItem是为页面提供Json对象的类，label是必须字段，搜索框中显示的内容即该字段的值。得到符合条件的数据集合后，需要使用Newtonsoft.Json.JsonConvert的SerializeObject方法进行序列化，再返回给客户端。

到此，即实现了本文开篇的贴图效果。

关于ASP.Net中英文复合检索文本框实现思路及代码的用户互动如下：

　　相关问题：

　　答： >>详细

　　相关问题：

　　答： >>详细

　　相关问题：

　　答： >>详细