jquery.autocomplete 模糊查询 支持分组
//demo
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<link rel="stylesheet" type="text/css" href="css/styles.css"/>
<script src="js/jquery-1.11.3.js" type="text/javascript" charset="utf-8"></script>
<script src="js/jquery.mockjax.js"></script>
<script src="js/jquery.autocomplete.js" type="text/javascript" charset="utf-8"></script>
<script type="text/javascript">
var countries ={}
//分组模糊搜索
var countries ={};
var phoneNumberTeams = ['15556785678', '15567895678','15556896789','18867891235','13856235678','1397890456'];
var roomNumberTeams = [ '8888','8899','8866','8800','6688','6666','8886','6600'];
var nameNnmberTeams = ['郭德纲','岳云鹏','成龙','刘德华','angelababy','8古天乐'];
var phoneNumber = $.map(phoneNumberTeams, function (team) { return { value: team, data: { category: '手机号' }}; });
var roomNumber = $.map(roomNumberTeams, function (team) { return { value: team, data: { category: '房间号' } }; });
var nameNnmber = $.map(nameNnmberTeams, function (team) { return { value: team, data: { category: '姓名' } }; });
var teams = phoneNumber.concat(roomNumber,nameNnmber);
$('#indentSearchAutoComplete').devbridgeAutocomplete({
lookup: teams,
minChars: 1,
onSelect: function (suggestion) {
$('#selection').html('You selected: ' + suggestion.value + ', ' + suggestion.data.category);
},
showNoSuggestionNotice: true,
noSuggestionNotice: '对不起,没有搜索结果',
groupBy: 'category'
});
</script>
<title></title>
</head>
<body>
<h2>支持分组</h2>
<p>手机号/房号/姓名</p>
<div>
<input type="text" name="country" id="autocomplete"/>
</div>
</body>
</html>
链接地址 https://www.devbridge.com/sourcery/components/jquery-autocomplete/
jquery.autocomplete 模糊查询 支持分组的更多相关文章
- T-SQL - query03_去重查询|模糊查询|排序|分组|使用函数
时间:2017-09-29 整理:byzqy 本篇仍以"梁山好汉"数据表为例,介绍几个常用的 T-SQL 查询语句: 去重查询,关键字:distinct 使用通配符模糊查询,关键字 ...
- jquery.select2 模糊查询
<!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <link re ...
- SqlServer 多表连接、聚合函数、模糊查询、分组查询应用总结(回归基础)
--exists 结合 if else 以及 where 条件来使用判断是否有数据满足条件 select * from Class where Name like '%[1-3]班' if (not ...
- 使用jQuery Autocomplete(自动完成)插件
jQuery 的Autocomplete(自动完成.自动填充)插件有不少,但比较下来我感觉,还是bassistance.de 的比较强大,我们就来写一些代码感受一下. 最简单的Autocomplete ...
- 表单模糊查询的三种简单方式(springboot-h2-mybatis)
前几天运营提到说后台管理系统有几个地方想要模糊查询.. 想了下是简单的,就是要注意以前方法的被调用情况,进行增量改动,以免牵一发而动全身.整理一波记录下(本次案例是按名字模糊查询学生信息). 三种 ...
- jquery.tagsinput的使用例子,包括模糊查询后端代码
<link rel="stylesheet" type="text/css" href="~/lib/jquery.tagsinput.jurg ...
- (四)MySQL条件查询(通配符、模糊查询)、排序查询、分组查询(单行、分组函数)
一.条件查询 1.含义:前面学的基础查询可以查询一个或多个字段,如果需要的数据仅仅是其中的某一行或多行就用到了条件查询. 2.语法:(序号表示语句执行顺序) SELECT 字段名 ③ FROM 表名 ...
- 关系数据库SQL之基本数据查询:子查询、分组查询、模糊查询
前言 上一篇关系数据库常用SQL语句语法大全主要是关系型数据库大体结构,本文细说一下关系型数据库查询的SQL语法. 语法回顾 SELECT [ALL|DISTINCT] <目标列表达式>[ ...
- winform中ComboBox利用AutoComplete属性实现模糊查询(有缺陷)
上一篇文章是用ComboBox里面的原生事件实现模糊查询,操作比较灵活一些,但是收到评论说,利用AutoComplete属性就可以实现模糊查询,但是据本人所了解,AutoComplete虽然能够方便的 ...
随机推荐
- opencv的学习笔记5
总结原博文中的一些边缘检测算子和滤波器.(Canny算子, Sobel算子, Laplace算子以及Scharr滤波器) 首先,一般的边缘检测包括三个步骤: 1)滤波:边缘检测的算法主要是基于图像 ...
- AppCan开发者资料分享(定期更新)
开发者培训 上海20150925开发者培训资料:链接:http://pan.baidu.com/s/1mgCLzz6 密码:mqgi 版权声明:本文为博主原创文章,未经博主允许不得转载.
- oracle中scn(系统改变号)
系统scn: select checkpoint_change# from v$database; 文件scn: select name ...
- SQL常用语句整理
有次笔试最后一页的三个数据库连接查询,没有写出来,被考官暗讽了下.现在想来,实习初,确实很LOW.现公司刚入职的时候,负责过ETL方面,所以和数据库打了不少交道,五十行的联合查询.上百行的存储过程很常 ...
- C# : CEF操作
代码挺差的,仅供学习.参考 class CEFGlueLoader { class CefAppImpl : CefApp { protected override void OnBeforeComm ...
- input 的blur事件之后button的onclick事件不执行解决方案
最近发现网页程序中有个BUG,就是在input标签输入框中输入完数据后,直接点击“取消” 按钮的时候.出现网页崩死的情况: 经过小主酸菜我,各种方法的尝试后,找到一个初步可以解决的方案,在这里分享给大 ...
- Hadoop深入浅出实战经典–第02讲
本文转载:通通学--知识学习与分享平台 Hadoop的核心 HDFS: Hadoop Distributed File System 分布式文件系统 MapReduce:并行计算框架 Yarn:集群资 ...
- Mybatis框架基于注解的方式,实对数据现增删改查
编写Mybatis代码,与spring不一样,不需要导入插件,只需导入架包即可: 在lib下 导入mybatis架包:mybatis-3.1.1.jarmysql驱动架包:mysql-connecto ...
- [转]vb socket通信(TCP/UDP)一对一、多对一
VB Socket编程(Winsock控件创建TCP/IP客户机/服务器程序) Winsock控件建立在TCP.UDP协议的基础上,完成与远程计算机的通信.即使对TCP/IP不太熟悉的用户,使用 ...
- MySQL新建用户,授权,删除用户,修改密码
首先要声明一下:一般情况下,修改MySQL密码,授权,是需要有mysql里的root权限的.注:本操作是在WIN命令提示符下,phpMyAdmin同样适用. 用户:phplamp 用户数据库: ...