后台直接从数据库,通过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显示的更多相关文章

  1. laravel数据库查询返回的数据形式

    版本:laravel5.4+ 问题描述:laravel数据库查询返回的数据不是单纯的数组形式,而是数组与类似stdClass Object这种对象的结合体,即使在查询构造器中调用了toArray(), ...

  2. 转 zabbix 优化方法 以及 后台数据库查询方法 两则

    ############sample 1 https://blog.51cto.com/sfzhang88/1558254 如何从Zabbix数据库中获取监控数据 sfzhang关注6人评论40627 ...

  3. 在vue中的form表单中下拉框中的数据来自数据库查询到的数据

    文章目录 1.实现的效果: 2.前端html代码 3.js中的代码 4.后端的方法 1.实现的效果: 增加一个新的类型到数据库 2.前端html代码 需要注意的部分:prop后边是表单中的字段 v-m ...

  4. SQL数据库查询一列数据返回一行

    SQL:数据库合并列数据:遇到一个更新的问题 想要把查询到的数据某一列拼接成字符串形式返回用的是SQL数据库中的STUFF函数比如 查询到的表(u_College)如下Id Name Age Clas ...

  5. Spring Security从后台数据库查询实现登陆控制

    Spring Security框架是一个控制登陆的框架,通过配置文件获取后台的用户名及密码,进行比较进行登陆判断 使用步骤 1.导入依赖 <!-- 身份验证 --> <depende ...

  6. MySql数据库-查询、插入数据时转义函数的使用

    最近在看一部php的基础视频教程,在做案例的时,当通过用户名查询用户信息的时候,先使用了转义函数对客户提交的内容进行过滤之后再交给sql语句进行后续的操作.虽然能看到转义函数本身的作用,但是仍然有一些 ...

  7. sql server数据库查询取出重复数据记录

    问题:博主在2011年6月,广东技术师范大学大四的时候,从学校计算机科学学院网站看到招聘信息并到广东中原地产IT部面试,很清楚记得当时的面试题目:怎么从数据库里面查询重复记录. 解决方案:在sql s ...

  8. Java基于POI实现excel任意多级联动下拉列表——支持从数据库查询出多级数据后直接生成【附源码】

     Excel相关知识点 (1)名称管理器--Name Manager [CoderBaby]首先需要创建多个名称(包含key及value),作为下拉列表的数据源,后续通过名称引用.可通过菜单:&quo ...

  9. extjs 按条件查询出的数据在grid上不显示

    在对extjs的按条件查询时.发现仅仅要输入查询条件时,grid上查询的结果就不显示,可是假设不输入条件默认查询全部的 时候就能显示数据.输入条件时后台查出来的数据时时正确的返回到json格式的数据也 ...

随机推荐

  1. ip routing 开启三层路由模式

    no ip router是关闭路由协议,no ip routing 是关闭三层的路由工作模式 no ip route是删除某条(静态)路由,比如no ip router 0.0.0.0 0.0.0.0 ...

  2. spring boot跨域问题的简便解决方案

    刚学spring boot的时候被跨域问题拦住好久,最终好不容易从网上抄了别人的极端代码才解决. 但是前些天看一同事的代码时,发现spring boot中用注解就可以解决. 在controller上添 ...

  3. 执行sudo命令时command not found的解决办法

    问题的原因: 在编译sudo包的时候默认开启了- -with-secure-path选项. 方法1: sudo vim /etc/sudoers,并在文件内增加这么一行:Defaults secure ...

  4. Git Bash输错账号密码如何重新输入

    很多时候我们容易在Git Bash操作的时候,不慎输入错误的用户名或密码,此时一直提示: remote: Incorrect username or password ( access token ) ...

  5. mybatis 的一对一关联查询association

    现在项目的列表查询数据需要查一个总数count, 如果直接写在同一个sql里面,会导致查询速度很慢, 因此,想到使用关联查询,例子如下: 附上代码: 其中遇到的坑哟: 1.association中的s ...

  6. 剑指offer46:圆圈中最后剩下的数字(链表,递归)

    1 题目描述 每年六一儿童节,牛客都会准备一些小礼物去看望孤儿院的小朋友,今年亦是如此.HF作为牛客的资深元老,自然也准备了一些小游戏.其中,有个游戏是这样的:首先,让小朋友们围成一个大圈.然后,他随 ...

  7. 剑指offer45:扑克牌顺子

    1 题目描述 LL今天心情特别好,因为他去买了一副扑克牌,发现里面居然有2个大王,2个小王(一副牌原本是54张^_^)...他随机从中抽出了5张牌,想测测自己的手气,看看能不能抽到顺子,如果抽到的话, ...

  8. thinkphp5日志文件权限的问题

    由于www用户和root用户(比如command的cli进程日志)都有可能对log文件进行读写. 如果是由www用户创建的log文件,不会出任何问题. 但是如果是先由root用户创建的log文件,然后 ...

  9. WIndows系统BAT文件语法和技巧 原文的地址(http://www.jb51.net/article/5828.htm)

    批处理文件是一个文本文件,这个文件的每一行都是一条DOS命令(大部分时候就好象我们在DOS提示符下执行的命令行一样),你可以使用DOS下的Edit或者Windows的记事本(notepad)等任何文本 ...

  10. 用Lua的协程实现类似Unity协程的语句块

    local co_time_tbl = {} setmetatable(co_time_tbl, { __len = function(o) for k, v in pairs(o) do count ...