由于现有系统有一个界面显示不友好,因此写单独重写了这个页面。期中有个要查询库位的功能。闲着没事做成类似百度,Google模糊查询的效果了
后台CS代码:
其他参考链接
中英文都可以。
效果图:
JS代码如下:
首先引用 css js 可到官方网站去下载 点击打开链接
<link href="css/ui-lightness/jquery-ui-1.10.3.custom.css" rel="stylesheet"/>
<script src="js/jquery-1.9.1.js"></script>
<script src="js/jquery-ui-1.10.3.custom.js"></script>
- var arry=new Array();
- $(document).ready(function () {
- $.ajax({
- type: "POST",
- contentType: "application/json",
- url: "AjaxPage.aspx/GetAllHints",
- data: "{}",
- dataType: "json",
- success: function (msg)
- {
- var datas = eval('(' + msg.d + ')');
- for(var i=0;i<datas.length;i++)
- {
- arry[i]=datas[i].Key;
- }
- $("#txtIput").autocomplete(
- {
- source:arry
- });
- }
- });
- });
后台CS代码:
- [WebMethod]
- public static string GetAllHints()
- {
- Dictionary<string, string> data = new Dictionary<string, string>();
- data.Add("ActionScript", "21782");
- data.Add("AppleScript", "238061");
- data.Add("BASIC", "838360");
- data.Add("Clojure", "242721");
- data.Add("COBOL", "63348");
- data.Add("苹果4s", "24030");
- data.Add("戴尔笔记本", "110105");
- data.Add("戴尔手机", "18870");
- data.Add("戴尔键盘", "30367");
- //JSON序列化
- DataContractJsonSerializer serializer = new DataContractJsonSerializer(data.GetType());
- string dataString=string.Empty;
- //定义一个stream用来存放序列化之后的内容
- using (MemoryStream ms = new MemoryStream())
- {
- serializer.WriteObject(ms, data);
- //返回json 字符串
- return System.Text.Encoding.UTF8.GetString(ms.ToArray());
- }
- }
其他参考链接
http://05ds210.blog.163.com/blog/static/5428207120095561314427/
http://kb.cnblogs.com/page/73227/
http://www.cnblogs.com/Peter-Zhang/archive/2011/10/22/2221147.html
http://hi.baidu.com/aplesen/item/77c163d9e9b72656d63aaebf