jquery.autocomplete 搜索文字提示
function GetJobTitle(obj) {
$(obj).autocomplete("GetJobTitle.ashx", {
max: 12, //列表里的条目数
minChars: 0, //自动完成激活之前填入的最小字符
width: 300, //提示的宽度,溢出隐藏
scrollHeight: 300, //提示的高度,溢出显示滚动条
matchContains: true, //包含匹配,就是data参数里的数据,是否只要包含文本框里的数据就显示
autoFill: false, //自动填充
extraParams: { key: function () { return $(obj).val(); }, key1: function () { return $(obj).val(); } },
parse: function (data) {
return $.map(eval(data), function (row) {
return {
data: row,
value: row.jobid,
result: row.jobTitle
}
}); //对ajax页面传过来的数据进行json转码
},
formatItem: function (row, i, max) {
return row.jobTitle;
},
formatMatch: function (row, i, max) {
return row.jobTitle + row.jobid;
},
formatResult: function (row) {
return row.jobid;
}
}).result(function (event, row, formatted) {
return row.jobid;
});
}
public void ProcessRequest (HttpContext context) {
String key = context.Request["key"];
String key1 = context.Request["key1"];
if (context.Request["q"] != null && context.Request["q"] != "")
{
context.Response.Write(GetLikeJobTitle(context.Request["q"]));
}
context.Response.Charset = "utf-8";
context.Response.ContentEncoding = System.Text.Encoding.UTF8;
context.Response.ContentType = "application/json";
context.Response.End();
}
public String GetLikeJobTitle(String key)
{
String strJson = String.Empty;
System.Data.DataSet ds = new DataSet();
using (System.Data.SqlClient.SqlConnection con = new SqlConnection(sqlcon))
{
System.Text.StringBuilder strWhere = new StringBuilder("select top 10 jobid,jobTitle from job_job where 1=1");
strWhere.Append(" and PATINDEX('%").Append(key.Trim()).Append("%',jobTitle)>0");
SqlDataAdapter sqlda = new SqlDataAdapter(strWhere.ToString(), con);
sqlda.Fill(ds);
if (ds.Tables[].Rows.Count > )
{
strJson = Newtonsoft.Json.JsonConvert.SerializeObject(ds.Tables[]);
}
}
return strJson;
}
<input type="text" value="" onkeyup="GetJobTitle(this);" style="width:300px;"/>
JS和CSS引用
<script src="Scripts/jquery-1.6.1.min.js" type="text/javascript"></script>
<link href="Scripts/jquery.autocomplete.css" rel="stylesheet" type="text/css" />
<script src="Scripts/jquery.autocomplete.js" type="text/javascript"></script>
<script src="Scripts/Auto_SaerchKey.js" type="text/javascript"></script>
jquery.autocomplete 搜索文字提示的更多相关文章
- jQuery 闪动的文字提示
原文地址:http://www.cnblogs.com/kiter/archive/2013/02/22/2922242.html 声明,本文转自网络. jQuery 闪动的文字提示,仿QQ头像闪烁闪 ...
- jQuery简单纯文字提示条
如何制作jQuery简单纯文字提示条,先介绍提示条(tooltip)的意思是用户鼠标悬停经过事件发生提示title.它们已经呈现在大多数浏览器中,当你可以提供一个链接或图片的title属性,就是用户将 ...
- Jquery实现搜索框提示功能
博客的前某一篇文章中http://www.cnblogs.com/hEnius/p/2013-07-01.html写过一个用Ajax来实现一个文本框输入的提示功能.最近在一个管理项目的项目中,使用后发 ...
- jQuery.Autocomplete实现自动完成功能-搜索提示功能
$(function(){ var availableTags=["ads","abc","acc"]; $("#tags&quo ...
- js搜索框 js仿百度搜索 js下拉框 jQuery.Autocomplete使用
做了一个网站,需要根据文本框的输入模糊搜索数据库内容给出提示供用户选择,就找到了jQuery.Autocomplete 效果如下图: 该插件托管在github上,具体地址:https://github ...
- asp.net mvc 使用 Autocomplete 实现类似百度,谷歌动态搜索条提示框。
Autocomplete是一个Jquery的控件,用法比较简单. 大家先看下效果: 当文本框中输入内容,自动检索数据库给出下拉框进行提示功能. 需要用此控件大家先到它的官方网站进行下载最新版本: ht ...
- jQuery实现的简单文字提示效果模拟title(转)
来源 http://www.cnblogs.com/puzi0315/archive/2012/10/17/2727693.html 模拟title实现效果,可以修改文字的样式,换行等. 文件下载: ...
- jQuery图片提示和文字提示
图片提示: 效果如下: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http:/ ...
- DOM操作在jQuery中的实用------文字提示和图片提示
关于文字提示想必是家喻户晓,操作呢说简单一点就是在超链接中加入title属性.但是在人机交互越来越倍受恩宠的年代,依靠浏览器自带的文字提示即title属性,提示效果的响应速度就(还是人艰不拆了吧~)s ...
随机推荐
- struts2文件上传1
<form action="hello/UploadAction_upload.action" enctype="multipart/form-data" ...
- python------模块定义、导入、优化 ------->hashlib模块
一.hashlib模块 用于加密相关的操作,3.x版本里代替了md5模块和sha模块,主要提供SHA1,SHA224,SHA256,SHA384,SHA512,MD5算法. (MD5消息摘要算法(英语 ...
- 汇编入门基础与helloworld
一个存储器拥有128个存储单元,可存储128个byte(字节),一个bite则又是由8个二进制位即bit(比特)组成,bit是计算机的最小信息单位. 总线分为地址总线,控制总线,数据总线 一个cpu有 ...
- Scala方法定义,方法和函数的区别,将方法转换成函数
1. 定义方法和函数 1.1. 定义方法 方法的返回值类型可以不写,编译器可以自动推断出来,但是对于递归函数,必须指定返回类型 1.2. 定义函数 1.3.方法和函数的区别 在函数式编程语言中,函数是 ...
- 通过plsql develop查看建表语句
右键--查看 右下角 如下显示,找出ddl语句 可以看到索引等
- 利用 MessageRPC 和 ShareMemory 来实现 分布式并行计算
可以利用 MessageRPC + ShareMemory 来实现 分布式并行计算 . MessageRPC : https://www.cnblogs.com/KSongKing/p/945541 ...
- DevExpress GridView 那些事儿
1:去除 GridView 头上的 "Drag a column header here to group by that column" --> 点击 Run Desig ...
- Spring Cloud Stream
Spring Cloud Stream是Spring Cloud的组件之一,是一个为微服务应用构建消息驱动能力的框架. 1.导入引用 <dependency> <groupId> ...
- 解决 VUE 微信登录验证 【感谢原文:https://segmentfault.com/a/1190000009493199】
[感谢原文:https://segmentfault.com/a/1190000009493199] SPA单页应用中微信授权登录的一点思路 单页应用应该如何解决微信授权登录的尴尬跳转?后退无法返回? ...
- 什么是词性标注(POS tagging)
词性标注也叫词类标注,POS tagging是part-of-speech tagging的缩写. 维基百科对POS Tagging的定义: In corpus linguistics, part-o ...