从后台数据库查询的List数据怎么在前台combobox显示
后台直接从数据库,通过jdbcTemplate查询数据,得到List数据集,里面是Map
List<Map<String, Object>> list = jdbcTemplate.queryForList(sql);
返回到前台的数据是这样的字符串
"[{name=zs,code=s1},{name=ls,code=s2},{name=ss,code=s3}]"
前台用JSON.parse(data)解析不了这种格式
combobox需要的是对象数组
解决办法:在后台List处理下,
用fastjson
JSON.toJSON(list)处理
然后传递到前台,就是这种格式:
"[{"name":"zs","code":"s1"},{"name":"ls","code":"s2"},{"name":"ss","code":"s3"}]"
这个时候前台,可以用JSON.parse(data)解析
data = JSON.parse(data)
处理数据,如果text为空,选中后,框内会显示空白,以防空白
for(var i=0;i<data.length;i++){
var obj = new Object();
obj.id = data[i].code;
obj.text= data[i].name===''?data[i].code:data[i].name;
alldata.push(obj);
}
//多选combobox
$('#column').combobox({
data: data,
valueField: 'id',
textField: 'text',
panelHeight: 'auto',
height:32,
multiple: true,
editable: false,
formatter: function (row) { // formatter方法就是实现了在每个下拉选项前面增加checkbox框的方法
var opts = $(this).combobox('options');
var id= row[opts.valueField];
var name= row[opts.textField];
if(name!=null&&name!=''){
return '<input type="checkbox" class="combobox-checkbox">' + name+"("+code+")";
}else{
return '<input type="checkbox" class="combobox-checkbox">' + code;
}
},
onLoadSuccess: function () { // 下拉框数据加载成功调用
debugger;
var cols = '${showColumns}';
if(cols!==''){
$('#column').combobox('setValues',cols.split(","));
}
//$('#column').combobox('select',cols);
var opts = $(this).combobox('options');
var target = this;
var values = $(target).combobox('getValues');//获取选中的值的values
$.map(values, function (value) {
var el = opts.finder.getEl(target, value);
el.find('input.combobox-checkbox')._propAttr('checked', true);
})
},
onSelect: function (row) { //选中一个选项时调用
debugger;
var opts = $(this).combobox('options');
//获取选中的值的values
$("#column").val($(this).combobox('getValues'));
//设置选中值所对应的复选框为选中状态
var el = opts.finder.getEl(this, row[opts.valueField]);
el.find('input.combobox-checkbox')._propAttr('checked', true);
},
onUnselect: function (row) {//不选中一个选项时调用
var opts = $(this).combobox('options');
//获取选中的值的values
$("#column").val($(this).combobox('getValues'));
var el = opts.finder.getEl(this, row[opts.valueField]);
el.find('input.combobox-checkbox')._propAttr('checked', false);
}
});
从后台数据库查询的List数据怎么在前台combobox显示的更多相关文章
- laravel数据库查询返回的数据形式
版本:laravel5.4+ 问题描述:laravel数据库查询返回的数据不是单纯的数组形式,而是数组与类似stdClass Object这种对象的结合体,即使在查询构造器中调用了toArray(), ...
- 转 zabbix 优化方法 以及 后台数据库查询方法 两则
############sample 1 https://blog.51cto.com/sfzhang88/1558254 如何从Zabbix数据库中获取监控数据 sfzhang关注6人评论40627 ...
- 在vue中的form表单中下拉框中的数据来自数据库查询到的数据
文章目录 1.实现的效果: 2.前端html代码 3.js中的代码 4.后端的方法 1.实现的效果: 增加一个新的类型到数据库 2.前端html代码 需要注意的部分:prop后边是表单中的字段 v-m ...
- SQL数据库查询一列数据返回一行
SQL:数据库合并列数据:遇到一个更新的问题 想要把查询到的数据某一列拼接成字符串形式返回用的是SQL数据库中的STUFF函数比如 查询到的表(u_College)如下Id Name Age Clas ...
- Spring Security从后台数据库查询实现登陆控制
Spring Security框架是一个控制登陆的框架,通过配置文件获取后台的用户名及密码,进行比较进行登陆判断 使用步骤 1.导入依赖 <!-- 身份验证 --> <depende ...
- MySql数据库-查询、插入数据时转义函数的使用
最近在看一部php的基础视频教程,在做案例的时,当通过用户名查询用户信息的时候,先使用了转义函数对客户提交的内容进行过滤之后再交给sql语句进行后续的操作.虽然能看到转义函数本身的作用,但是仍然有一些 ...
- sql server数据库查询取出重复数据记录
问题:博主在2011年6月,广东技术师范大学大四的时候,从学校计算机科学学院网站看到招聘信息并到广东中原地产IT部面试,很清楚记得当时的面试题目:怎么从数据库里面查询重复记录. 解决方案:在sql s ...
- Java基于POI实现excel任意多级联动下拉列表——支持从数据库查询出多级数据后直接生成【附源码】
Excel相关知识点 (1)名称管理器--Name Manager [CoderBaby]首先需要创建多个名称(包含key及value),作为下拉列表的数据源,后续通过名称引用.可通过菜单:&quo ...
- extjs 按条件查询出的数据在grid上不显示
在对extjs的按条件查询时.发现仅仅要输入查询条件时,grid上查询的结果就不显示,可是假设不输入条件默认查询全部的 时候就能显示数据.输入条件时后台查出来的数据时时正确的返回到json格式的数据也 ...
随机推荐
- 手把手教你安装 FastAdmin 到虚拟主机 (phpStudy)
手把手教你安装 FastAdmin 到虚拟主机 (phpStudy)原文: https://forum.fastadmin.net/thread/2524 下载 FastAdmin下载 FastAdm ...
- webpack-dev-server 导致的 invalid host header
这几天做的一个项目,在这个项目的 js 方面,我将其分业务和功能的拆分成模块化,然后使用 webpack 来进行打包.(第一次在公司产品中使用 webpack) 然后使用了 webpack-dev-s ...
- oracle数据库用户之间授权
今天遇到一个数据库的问题: 系统数据库用户下创建了几个视图用于外部系统开发报表使用,当外部系统提取视图数据时,需要通过一个只能访问需要视图权限的用户,于是想到给他创建一个新的用户,并给这个用户分配只能 ...
- 2.5路由网关:Zuul
在原有的工程上,创建一个新的工程 创建service-zuul工程 其pom.xml文件如下: <?xml version="1.0" encoding="UTF- ...
- [DEBUG] spring boot在eclipse中用maven打包成jar访问templates报500错误
更新:打war包的话只要把html文件放在resources/templates下即可,根本不需要放外面. 配置application.yml和templates放外面这种做法,打war包确实不行. ...
- ros msg和srv使用
在包文件中新建文件夹srv和msg,在这两个文件夹中新建test.msg,test.srv 修改apckage.xml 添加以下内容 <build_depend>:message_gene ...
- Linux基础指令--文件操作
mkdir a 创建一个名为a的文件夹 touch a.txt 创建一个名为a.txt的文件 mv b sm/ 将文件(夹)b 移动到当前目录下的sm目录下 rm -rf a 删除 a文件 -rf为参 ...
- Django-djangorestframework-请求模块-获取请求参数
目录 请求模块 源码分析 正式使用 总结 请求模块 主要是分析 drf 二次封装后的 request 对象 以及怎么拿到请求传递过来的数据(url 拼接的数据,数据包传过来的数据) 源码分析 源码查看 ...
- 洛谷P1087 FBI树
P1087 FBI树题解: 看到这个题,我想到了线段树!(毕竟刚搞完st表...) 当然,题解中有位大佬也用的线段树,但是当时看的时候我看见了9个if,当场去世. 那么这是一个不用暴力的线段树,且简单 ...
- 【树上异或和计数】czr 太弱啦
[题目]: 给一棵树,求异或和为k的路径个数. [题解]: 很遗憾比赛时做不出来,后来看别人题解做出来的.用于记录博客所用. 然后进行Dfs,得到从根节点到某一个节点的异或值,计算方案时只需要在map ...