平台:Vs
jQuery 1.4.2
jquery.ui.autocomplete.js 1.8.5
方法概述:在ajax传输数据时把jquery.ui.autocomplete.js 中的传输值改成encodeURI() 形式,然后在后台处理代码里再用System.Web.HttpUtility.UrlDecode()方法把传输的
值进行解码。
先上图片,无图无真相么!哈哈!
具体请看代码吧:
页面代码:
<link rel="stylesheet" href="JqueryUi/themes/base/jquery.ui.all.css" /> //这个css文件要先放到最前面,否则可能报未定义错误<script type="text/javascript" src="JqueryUi/jquery-1.4.2.min.js"></script><script type="text/javascript" src="JqueryUi/ui/jquery.ui.core.js"></script><script type="text/javascript" src="JqueryUi/ui/jquery.ui.widget.js"></script><script type="text/javascript" src="JqueryUi/ui/jquery.ui.position.js"></script><script type="text/javascript" src="JqueryUi/ui/jquery.ui.autocomplete.js"></script<script language="javascript" type="text/javascript">$(function() {$("#search").autocomplete({source: function(request, response) {$.ajax({url: "UserControl/GetService.ashx",dataType: "json",data: request,success: function(data) {response(data);},});}});});<div><input id="search" type="text" /></div>
后台处理类:
<%@ WebHandler Language="C#" Class="GetService" %>using System;using System.Web;public class GetService : IHttpHandler{public void ProcessRequest(HttpContext context){if (context.Request.QueryString["term"] != null && context.Request.QueryString["term"] != ""){context.Response.Clear();//context.Response.Charset = "gb2312";context.Response.Buffer = true;//context.Response.ContentEncoding = System.Text.Encoding.UTF8;context.Response.ContentType = "text/plain";string ss = System.Web.HttpUtility.UrlDecode(context.Request.QueryString["term"]);//GetQueryString(context.Request.QueryString["term"],false)context.Response.Write(GetLikeUserName(ss));context.Response.Flush();context.Response.Close();context.Response.End();}}/// <summary>/// 拼接json/// </summary>/// <param name="key">关键词</param>/// <returns></returns>private String GetLikeUserName(string key){//System.Text.Encoding.Convert(if (key == null) return "[\"\"]";
// 这里就是获取数据源,大家自己写了System.Data.DataSet ds = Angel.Data.DatabaseHelper.ExecuteDataset("Select * from Services where Service like '%" + key + "%'", "1");int length = ds.Tables[0].Rows.Count;if (length == 0) return "[\"\"]";string[] listWord;if (length > 10){listWord = new string[10];}else{listWord = new string[length];}for (int i = 0; i < length; i++){if (i <= 9){listWord[i] = ds.Tables[0].Rows[i]["Service"].ToString();}else break;}//搜索,返回10个关键词System.Text.StringBuilder sbstr = new System.Text.StringBuilder("[");int ct = listWord.Length;for (int i = 0; i < ct; i++){sbstr.Append("\"" + listWord[i] + "\"");if (i == ct - 1)sbstr.Append("]");elsesbstr.Append(",");}return sbstr.ToString();}public bool IsReusable{get{return false;}}}
下面是最重要的代码了!我们知道像上面那样当GetService.ashx这个类收到 QueryString 时显示的肯定是乱码!
好了打开你引用的jquery.ui.autocomplete.js 我们来修改以下内容
search: function(value, event) {value = value != null ? value : this.element.val();value = encodeURI(value); // 请注意这行代码,是后加上去的// always save the actual value, not the one passed as an argumentthis.term = this.element.val();if (value.length < this.options.minLength) {return this.close(event);}clearTimeout(this.closing);if (this._trigger("search") === false) {return;}return this._search(value);},
查找到 search 这个函数,然后按上面的修改完保存退出!好大功告成!
好了,基本先到这!有什么问题以后我会补充的!今天过的真纠结啊。。。
祝大家开心!
-------------------------------------------------------------------------------------------------------------------