基于jquery的文本框与autocomplete结合使用(asp.net+json)

  JS脚本引用

  

复制代码 代码如下:

  <script src="/scripts/Jquery.autocomplete/jquery.autocomplete.js" type="text/javascript"></script>

  样式引用

  

复制代码 代码如下:

  <style type="text/css" media="all">

  @import url("/scripts/Jquery.autocomplete/css/jquery.autocomplete.css");

  </style>

  JS代码

  

复制代码 代码如下:

  ?$(document).ready(function () {

  $("#<%=_SearchKeyGame.ClientID %>").autocomplete("./AjaxHandle/AutoComplete.ashx?type=game", {

  minChars: 0,

  max: 9,

  width: 150,

  matchContains: true,

  autoFill: false,

  formatItem: function (row, i, max) {

  return row.name;

  },

  formatMatch: function (row, i, max) {

  return row.name + " ";

  },

  formatResult: function (row) {

  return row.name;

  }

  });

  jQuery("#<%=_SearchKeyGame.ClientID %>").result(function (event, data, formatted) {

  if (data) {

  jQuery("#_SearchKeyGame").attr("value", data.name);

  }

  else {

  }

  });

  $("#<%=_SearchKeyPlat.ClientID %>").autocomplete("./AjaxHandle/AutoComplete.ashx?type=plat", {

  minChars: 0,

  max: 9,

  width: 150,

  matchContains: true,

  autoFill: false,

  formatItem: function (row, i, max) {

  return row.name;

  },

  formatMatch: function (row, i, max) {

  return row.name + " ";

  },

  formatResult: function (row) {

  return row.name;

  }

  });

  AutoComplete。ashx返回JOSON值

  

复制代码 代码如下:

  string queryStr = context.Request.QueryString["q"];

  context.Response.ContentType = "text/plain";

  context.Response.Cache.SetNoStore();

  string jsponString = "[";

  string where = string.Format(" (select dbo.[f_GetPy](platname)) like '%{0}%' or platname like '%{0}%'", Common.Common.ToSql(queryStr));

  DataTable dt = new Models.Plat().GetDataTable(where,10);

  if (dt.Rows.Count > 0)

  {

  for (int i = 0; i < dt.Rows.Count; i++)

  {

  jsponString += "{id:\"" + dt.Rows[i]["PlatID"].ToString() + "\",name:\"" + dt.Rows[i]["PlatName"].ToString() + "\"},";

  }

  }

  jsponString = jsponString.Trim(new char[] { ',' });

  jsponString += "]";

  context.Response.Write(jsponString);

  context.Response.End();