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


Posted in Javascript onMay 30, 2012

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();
Javascript 相关文章推荐
JavaScript中的对象化编程
Jan 16 Javascript
javascript中打印当前的时间实现思路及代码
Dec 18 Javascript
js,jquery滚动/跳转页面到指定位置的实现思路
Jun 03 Javascript
jQuery中hasClass()方法用法实例
Jan 06 Javascript
Javascript基础教程之for循环
Jan 18 Javascript
使用Browserify配合jQuery进行编程的超级指南
Jul 28 Javascript
Zabbix添加Node.js监控的方法
Oct 20 Javascript
JavaScript禁止微信浏览器下拉回弹效果
May 16 Javascript
bootstrap table单元格新增行并编辑
May 19 Javascript
js函数和this用法实例分析
Mar 13 Javascript
Node.js中出现未捕获异常的处理方法
Jun 29 Javascript
Vue中插槽slot的使用方法与应用场景详析
Jun 08 Vue.js
基于jQuery的倒计时实现代码
May 30 #Javascript
基于jquery的放大镜效果
May 30 #Javascript
幻灯片带网页设计中的20个奇妙应用示例小结
May 27 #Javascript
Javascript的常规数组和关联数组对比小结
May 24 #Javascript
基于mootools插件实现遮罩层新手引导
May 24 #Javascript
jQuery 拖动层(在可视区域范围内)
May 24 #Javascript
jQuery 菜单随滚条改为以定位方式(固定要浏览器顶部)
May 24 #Javascript
You might like
php数字游戏 计算24算法
2012/06/10 PHP
PHP中如何定义和使用常量
2013/02/28 PHP
PHP数组编码gbk与utf8互相转换的两种方法
2016/09/01 PHP
PHP下 Mongodb 连接远程数据库的实例代码
2017/08/30 PHP
关于Yii2框架跑脚本时内存泄漏问题的分析与解决
2019/12/01 PHP
PHP实现提取多维数组指定一列的方法总结
2019/12/04 PHP
PHP+Redis链表解决高并发下商品超卖问题(实现原理及步骤)
2020/08/03 PHP
JavaScript编程的10个实用小技巧
2014/04/18 Javascript
javascript定义变量时带var与不带var的区别分析
2015/01/12 Javascript
Jquery中find与each方法用法实例
2015/02/04 Javascript
JavaScript给按钮绑定点击事件(onclick)的方法
2015/04/07 Javascript
Angular 路由route实例代码
2016/07/12 Javascript
完美解决js传递参数中加号和&amp;号自动改变的方法
2016/10/11 Javascript
微信小程序 地图map实例详解
2017/06/07 Javascript
微信小程序发布新版本时自动提示用户更新的方法
2019/06/07 Javascript
vue-cli3 取消eslint校验代码的解决办法
2020/01/16 Javascript
vue.js实现简单购物车功能
2020/05/30 Javascript
详解JavaScript之ES5的继承
2020/07/08 Javascript
[43:58]DOTA2上海特级锦标赛C组败者赛 Newbee VS Archon第二局
2016/02/27 DOTA
[45:10]NB vs Liquid Supermajor小组赛 A组胜者组决赛 BO3 第二场 6.2
2018/06/04 DOTA
python实现zencart产品数据导入到magento(python导入数据)
2014/04/03 Python
Python正则表达式匹配HTML页面编码
2015/04/08 Python
Python读取和处理文件后缀为.sqlite的数据文件(实例讲解)
2017/06/27 Python
Python实现购物系统(示例讲解)
2017/09/13 Python
Python numpy.array()生成相同元素数组的示例
2018/11/12 Python
django小技巧之html模板中调用对象属性或对象的方法
2018/11/30 Python
python 多线程重启方法
2019/02/18 Python
Python3 pandas 操作列表实例详解
2019/09/23 Python
Python如何实现小程序 无限求和平均
2020/02/18 Python
Python优秀开源项目Rich源码解析的流程分析
2020/07/06 Python
使用CSS3和Checkbox实现JQuery的一些效果
2015/08/03 HTML / CSS
初中数学教学反思
2014/01/16 职场文书
安全主题班会教案
2015/08/12 职场文书
JavaScript控制台的更多功能
2021/04/28 Javascript
基于python定位棋子位置及识别棋子颜色
2021/07/26 Python
详解MySQL中timestamp和datetime时区问题导致做DTS遇到的坑
2021/12/06 MySQL