asp.net + ajax + sqlserver 自动补全功能
2014-03-05 09:39
567 查看
代码下载页面:http://download.csdn.net/detail/zhanghui_hn/6994105
说明:数据库连接字符串在web.config文件中,为方便运行使用的是官方的Northwind数据库。
参考(向其作者致敬):
² http://www.loveweb8.com/plus/demo.php?aid=57这个例子是html源码。利用jquery.autocomplete插件利用js实现了自动补全功能。由于我的需要是结合sqlserver数据库表实现自动补全功能。就下来就是将数据库表转为js数组,自然而然就想到了ajax。
²
Asp.NetAjax的两种基本开发模式这篇文章中的第二部分就是说:js调用webservice的示例。
代码解析。
1. 添加webservice文件。
添加新项--“启用了AJAX的WCF服务” 将新文件命名为DBService.svc.
2. 在DBService.svc中添加函数,函数返回值就是 提示自动补全的数据。
3. 在default.aspx文件添加js、css文件:
4. 在default.aspx的head部分中$().ready(function ())函数中调用webservice获取自动补全的数据,并将数据关联到输入框中。
5. Finish。项目发布后如果提示webservice找不到对象,请参考了http://www.cnblogs.com/aspnethot/articles/2421678.html
说明:数据库连接字符串在web.config文件中,为方便运行使用的是官方的Northwind数据库。
参考(向其作者致敬):
² http://www.loveweb8.com/plus/demo.php?aid=57这个例子是html源码。利用jquery.autocomplete插件利用js实现了自动补全功能。由于我的需要是结合sqlserver数据库表实现自动补全功能。就下来就是将数据库表转为js数组,自然而然就想到了ajax。
²
Asp.NetAjax的两种基本开发模式这篇文章中的第二部分就是说:js调用webservice的示例。
代码解析。
1. 添加webservice文件。
添加新项--“启用了AJAX的WCF服务” 将新文件命名为DBService.svc.
2. 在DBService.svc中添加函数,函数返回值就是 提示自动补全的数据。
[OperationContract] public string getSortList() { List<string> sorts = new List<string>(); using (SqlConnection cn = new SqlConnection(ConfigurationManager.ConnectionStrings["zhui.pc"].ConnectionString)) { cn.Open(); SqlCommand cmd = new SqlCommand("select [LastName] from [dbo].[Employees]", cn); DataTable dt = new DataTable(); using (SqlDataAdapter da = new SqlDataAdapter(cmd)) { da.Fill(dt); } foreach (DataRow row in dt.Rows) { sorts.Add(row[0].ToString()); } cn.Close(); } return string.Join(",", sorts.ToArray()); }
3. 在default.aspx文件添加js、css文件:
<script src="Scripts/jquery-1.7.1.min.js" type="text/javascript"></script> <script src="Scripts/jquery.autocomplete.min.js" type="text/javascript"></script> <link href="Styles/jquery.autocomplete.css" rel="stylesheet" type="text/css" />
4. 在default.aspx的head部分中$().ready(function ())函数中调用webservice获取自动补全的数据,并将数据关联到输入框中。
<script type="text/javascript"> $().ready(function () { NewsSort.getSortList(OnComplete, OnFailed, null); function OnComplete(args, context) { $('#MainContent_searchBox').AutoComplete({ 'data': args.split(","), 'itemHeight': 20, 'listDirection': 'down', 'width': 280 }).AutoComplete('show'); } function OnFailed(args) { alert("出错了!"); } }); </script>
5. Finish。项目发布后如果提示webservice找不到对象,请参考了http://www.cnblogs.com/aspnethot/articles/2421678.html
相关文章推荐
- asp.net+ajax+sqlserver自动补全功能实现解析
- asp.net+ajax+sqlserver自动补全功能实现解析
- 通用的自动完成功能 -Ajax - asp.net
- Asp.net + jQuery + jQuery pager plugin + Sql Server 利用Ajax实现真正的无刷新分页浏览
- 在ASP.net MVC里用Jquery的Ajax功能调用相关LinqtoSQL生成的类出现错误---循环引用
- 通用的自动完成功能 -Ajax + asp.net
- 纯ajax+asp.net+sqlserver多方式分页
- asp.net+ajax+WebServer 输入自动提示历史记录
- Jquery+Ajax+asp.net+sqlserver-编写的通用邮件管理(有源码)
- 使用ASP.NET AJAX开发文本框自动提示功能
- 纯ajax+asp.net+sqlserver多方式分页 .
- asp.net ajax 使用AutoCompleteExtender开发自动完成功能(转载)
- Jquery+Ajax+asp.net+sqlserver-编写的通用邮件管理(源码)
- 用asp.net+Jquery+Ajax+sqlserver编写的 (英语六级记单词)
- ajax+asp.net+sqlserver多方式分页
- ASP.NET AJAX文本框自动提示功能
- 纯ajax+asp.net+sqlserver多方式分页
- C#构造方法(函数) C#方法重载 C#字段和属性 MUI实现上拉加载和下拉刷新 SVN常用功能介绍(二) SVN常用功能介绍(一) ASP.NET常用内置对象之——Server sql server——子查询 C#接口 字符串的本质 AJAX原生JavaScript写法
- 通用的自动完成功能 -Ajax + asp.net(转载)
- 用asp.net+Jquery+Ajax+sqlserver编写的 (英语六级记单词)