项目中有时会用到自动补全查询,就像Google搜索框、淘宝商品搜索功能,输入汉字或字母,则以该汉字或字母开头的相关条目会显示出来供用户选择, autocomplete插件就是完成这样的功能。
autocomplete官网 : nofollow" target="_blank" href="http://bassistance.de/jquery-plugins/jquery-plugin-autocomplete/">http://bassistance.de/jquery-plugins/jquery-plugin-autocomplete/ (可下载jQuery autocomplete插件)。
1. 创建 AjaxPage.aspx 页面,在其中定义 WebMethod 方法来返回 搜索页面需要的输入框所有提示条目。
后台代码如下:public partial class AjaxPage : System.Web.UI.Page
{
[WebMethod]
public static string GetAllHints()
{
Dictionary<string,string> data = new Dictionary<string,string>();
data.Add("苹果4代iphone正品","21782");
data.Add("苹果4代 手机套","238061");
data.Add("苹果4","838360");
data.Add("苹果皮","242721");
data.Add("苹果笔记本","63348");
data.Add("苹果4s","24030");
data.Add("戴尔笔记本","110105");
data.Add("戴尔手机","18870");
data.Add("戴尔键盘","30367");
{
[WebMethod]
public static string GetAllHints()
{
Dictionary<string,string> data = new Dictionary<string,string>();
data.Add("苹果4代iphone正品","21782");
data.Add("苹果4代 手机套","238061");
data.Add("苹果4","838360");
data.Add("苹果皮","242721");
data.Add("苹果笔记本","63348");
data.Add("苹果4s","24030");
data.Add("戴尔笔记本","110105");
data.Add("戴尔手机","18870");
data.Add("戴尔键盘","30367");
DataContractJsonSerializer serializer = new DataContractJsonSerializer(data.GetType());
using (MemoryStream ms = new MemoryStream())
{
serializer.WriteObject(ms,data);
return System.Text.Encoding.UTF8.GetString(ms.ToArray());
}
}
}
注:该方法返回的数据格式为json字符串。