js AutoComplete

完全基于JqueryUI

ASPX代码：

?

1 2 3 4 5 6 7 8 9 10

< link rel = "stylesheet" href = "Styles/jquery-ui.css" type = "text/css" media = "all" /> < script type = "text/javascript" src = "Scripts/jquery.min.js" ></ script > < script type = "text/javascript" src = "Scripts/jquery-ui.min.js" ></ script > < script type = "text/javascript" >      $(function () {          $('#tbSearch').autocomplete({              source: "AutoComplete.ashx"          });      }); </ script >

后台代码：

?

1 2 3 4 5 6 7 8 9 10 11 12 13

public void ProcessRequest(HttpContext context) {      string searchText = context.Request.QueryString[ "term" ];      //Get Result here      //````      //````      //Get Result here      JavaScriptSerializer serializer = new JavaScriptSerializer();        string jsonString = serializer.Serialize(results);        context.Response.Write(jsonString); }

可能有人会问，context.Request.QueryString["term"];中的term是怎么来的？我们通过aspx根本看不到term。

我们可以用任何浏览器的F12的NetWork抓出来：

 

上面是ASP.NET下的实现，在ASP.NET MVC2或者MVC3或者MVC4中，我们不用使用JavaScriptSerializer和ashx 这种方式来序列化成JSON并且向客户端write，因为它们提供了JSONResult

?

1 2 3 4 5

public JsonResult GetResourceByKeyWord() {      //get searchResult here      return Json(searchResult, JsonRequestBehavior.AllowGet); }