使用jQuery QueryBuilder构建查询

说明

最近在给老项目做各种新功能,其中一项是给数据添加各种用户自定义的查询,但是用户不会写SQL,我们得用图形化界面才能让他操作啊o(╥﹏╥)o,上网一搜,发现有我需要的东西->jQuery-QueryBuilder(还有一个国产的和这个很像,但很久没更新了不敢用->BuilderDynmic),实现效果类似下面

点击确定直接返回下面的查询条件(可以直接拼到where)

快速开始

在这个例子中我的左边是一棵树,点击树加载右边table(字段不定),jQuery-QueryBuilder对JQ版本是有要求的具体查看自己的版本,错误的话控制台会有提示,注意引入query-builder.zh-CN.js就能实现中文了,我把我用到的所有js和css都打包了,戳->七牛云下载,戳->CSDN下载

filters请求得到的数据格式如下

[{
	"id": "aa",
	"type": "string",
	"label": "安安"
}, {
	"id": "bb",
	"type": "string",
	"label": "版本"
}, {
	"id": "id",
	"type": "string",
	"label": "id"
}]
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8" %>
<script type="text/javascript" src="./js/jquery-1.12.min.js"></script>
<script type="text/javascript" src="./js/jquery.easyui.min.js"></script>
<script type="text/javascript" src="./js/jquery.easyui.mobile.js"></script>
<script type="text/javascript" src="./js/bootstrap.js"></script>
<script type="text/javascript" src="./js/query-builder.standalone.js"></script>
<script type="text/javasc
  • 1
    点赞
  • 2
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值