jquery queryBuilder过滤插件的使用
1.此插件用于过滤搜索的功能,功能强大,可实现复杂条件过滤,单选多选的等条件的过滤。还可以在插件中调用其他插件。
下载地址和文档阅读:http://querybuilder.js.org/
效果图:

2.全英文文档,感觉学起来有丢丢的困难==
需要引入的文件
<link rel="stylesheet" href="${ctx}/resource/plugins/QueryBuilder/css/query-builder.default.min.css">
//基于jquery,还要引入jquery框架
<script type="text/javascript" src="${ctx}/resource/plugins/QueryBuilder/js/query-builder.standalone.js"></script>
<script type="text/javascript" src="${ctx}/resource/plugins/QueryBuilder/i18n/query-builder.zh-CN.js"></script>//中文显示
3.基本用法
<div id='builder-basic'></div>
$('#builder-basic').queryBuilder({
plugins: {
'bt-selectpicker':{liveSearch:true,style:'btn-inverse'},//引用了selectpicker
'bt-tooltip-errors':{delay:100},
},
filters: data,
rules: rules_basic })
上面的引用了selectpicker插件,使搜索框带一个搜索字段的功能。
例如:

未完待续。。。。。。。。。。。。
jquery queryBuilder过滤插件的使用的更多相关文章
- MixItUp:超炫!基于 CSS3 & jQuery 的过滤和排序插件
MixItUp 是一款轻量,但功能强大的 jQuery 插件,提供了对分类和有序内容的美丽的动画过滤和排序功能.特别适合用于作品集网站,画廊,图片博客以及任何的分类或有序内容. 它是如何工作的? Mi ...
- 提升用户体验的最佳免费 jQuery 表单插件
网页表单是一个老生常谈的话题.出于这样或那样的目的,一些示例中都会包括用户注册,电子商务结算,用户设置甚至联系人表格.而输入栏是非常容易用现代的CSS3技术来应用样式.但是到底什么决定整体用户体验? ...
- Vanilla Masker – 功能强大的输入过滤插件
Vanilla Masker 是一个纯 JavaScript 实现的输入内容过滤和自动转换插件.现在你可以使用一个简单而纯粹的 JavaScript 库来控制你的 input 元素,而不需要加载 jQ ...
- Jquery Slick幻灯片插件
slick 是一个基于 jQuery 的幻灯片插件,具有以下特点: 支持响应式 浏览器支持 CSS3 时,则使用 CSS3 过度/动画 支持移动设备滑动 支持桌面浏览器鼠标拖动 支持循环 支持左右控制 ...
- 提示用户体验的最佳免费 Jquery 表单插件
网页表单是一个老生常谈的话题.出于这样或那样的目的,一些示例中都会包括用户注册,电子商务结算,用户设置甚至联系人表格.而输入栏是非常容易用现代的CSS3技术来应用样式.但是到底什么决定整体用户体验? ...
- 10款jQuery文本高亮插件
[编者按]本文作者为 Julian Motz,主要介绍十款 jQuery 文本高亮插件的现状.文章系国内 ITOM 管理平台 OneAPM 编译呈现. 很多应用或网站都为用户提供搜索关键词的方法.为了 ...
- Jquery的部分插件
jQuery Easing:jQuery 动画效果扩展 jQuery Migrate:jQuery 应用迁移辅助插件Modernizr:专为HTML5和CSS3开发的功能检测类库jQuery Flex ...
- jQuery Pagination分页插件--刷新
源码地址:https://github.com/SeaLee02/FunctionModule/blob/master/UploadFiles/WebDemo/FenYE/FenYeDemo.aspx ...
- 推荐几款jquery图片切换插件
一.前言 毕业季到了,大家都在匆匆忙忙的记录大学里最美好的时光,照片中各种花式.各种姿势都涌现出来了.这么多的照片怎么展示出来给自己的好友看呢?有人选择做成视频,有人选择ps之后做成图片集,而我选择利 ...
随机推荐
- SQL SEVER 递归查询
with ts as ( --首先要查询出最原始父级的信息 union all --全连接 select a.fitemclassid,a.fitemid, a.fnumber,a.Fparentid ...
- C#学习 第十节
操作符(operator) 1.操作符的概览 从上到下优先级依次减弱: 2.操作符的本质 操作符的本质是函数的简记法: 计算机的操作符不能脱离与它关联的数据类型: 3.操作符的优先级 可以使用括号 4 ...
- Day 12 闭包函数,装饰器
闭包函数 回顾: 1.函数对象:可以将定义在函数内的函数返回到全局使用.从而打破了函数层级限制 2.名称空间与作用域:作用域关系在函数定义阶段时就已经固定死了,与调用位置无关,即在任意位置调用函数都需 ...
- 网络教程(12) TCP协议
IP协议的限制 IP协议需要 datalink帧来包装它 Ethernet或者PPP 一般都有1500byte字节或者大小的限制 可能会出现的问题 Packet loss – retransmit R ...
- 网络教程(10)回顾ARP和ping数据包
Ping 192.168.20.2 ICMP Echo (Internet Control Message Protocol ICMP Echo request ICMP Echo reply 收到I ...
- nyoj56-阶乘因式分解(一)
56-阶乘因式分解(一) 内存限制:64MB时间限制:3000msSpecial Judge: No accepted:6submit:7 题目描述: 给定两个数m,n,其中m是一个素数. 将n(0& ...
- Python hangman小游戏
hangman # words.py 使用pickle永久性存储数据 import pickle filename = 'words.pk' data = ['cat', 'dog', 'perro' ...
- 各项硬件使用剖析(一)---让你一眼就能区分瓶颈是Memory、processor ORdisk!
- ACdream 1415 Important Roads
Important Roads Special JudgeTime Limit: 20000/10000MS (Java/Others)Memory Limit: 128000/64000KB (Ja ...
- HDU 2553 N皇后问题 (DFS_回溯)
Problem Description 在N*N的方格棋盘放置了N个皇后,使得它们不相互攻击(即随意2个皇后不同意处在同一排,同一列,也不同意处在与棋盘边框成45角的斜线上. 你的任务是.对于给定的N ...