pentaho  自带的component 虽多,但是当用户需要在一个表格中查看多个组别的数据时,pentaho自带的单选框就不能实现了,所以复选下拉框势在必行,实现效果如下:

实现原理是借用了jquery ztree 插件。

首先集成ztree 插件,如图

画你想要的图

<div class="content_wrap">
<div class="zTreeDemoBackground left">
<ul class="list">
<li class="title"> <input id="citySel" type="text" readonly value="" style="width:120px;" onclick="showMenu();" />
 <a id="menuBtn" href="#" onclick="showMenu(); return false;">选择</a></li>
</ul>
</div>
</div> <div id="menuContent" class="menuContent" style="display:none; position: absolute;">
<ul id="treeDemo" class="ztree" style="margin-top:0; width:180px; height: 300px;"></ul>
</div>

 

书写数据源。。。

新建query component 用来接收数据

需要注意的是 ztree 插件需要的是一个json 格式的数组

所以要在post 里面把接收的数据源 换算成  json 数组

function fun() {
if(!myResult.length) return null;
var i = 0;
array = [];
for(var i = 0;i < myResult.length;i++){
array.push({"id":myResult[i][0],"pId":myResult[i][1],"name":myResult[i][2]});
}
console.log(JSON.stringify(array))
$.fn.zTree.init($("#treeDemo"), setting, array);
}

 

完毕!

pentaho cde 自定义复选下拉框 checkbox select的更多相关文章

  1. c# 复选下拉框

    引用dll: http://pan.baidu.com/s/1qXa97UO 自定义类: namespace TMI_S { /// <summary> /// 功能描述:自定义多选下拉框 ...

  2. 自定义SWT控件二之自定义多选下拉框

    2.自定义下拉多选框 package com.view.control.select; import java.util.ArrayList; import java.util.HashMap; im ...

  3. jQuery自定义多选下拉框

    项目中需要自定义一个下拉框多选插件,业务问题还是自己实现比较好 通过$.fn 向jQuery添加新的方法 下拉数据通过参数传递进去,通过调用该插件时接收,选择后的确定与取消事件采用事件传递方式 代码如 ...

  4. 多选下拉框(select 下拉多选)

    方法一:使用multiple-select.js和multiple-select .css实现 HTML代码: <select id='checkedLevel' style="wid ...

  5. pentaho cde数据联动,下拉框,文本框,图形

    先看一下效果: 开源bi工具pentaho数据联动,和传统意义上的更改数据不同,pentaho cde 需要一个监听来动态传值. 说一下需要注意的几个地方吧 1.参数是不能在两个图表中直接传递的,必须 ...

  6. bootstrap-multiselect.js多选下拉框初始化时默认选中初始值

    bootstrap-multiselect.js多选下拉框默认值设置 一.案例数据格式  二.HTML代码 <select id="msgRoles" multiple=&q ...

  7. jQuery自定义漂亮的下拉框插件8种效果演示

    原始的下拉框不好看这里推荐一个jQuery自定义漂亮的下拉框插件8种效果演示 在线预览 下载地址 实例代码 <!DOCTYPE html> <html lang="en&q ...

  8. Easyui-Combobox多选下拉框

    因为工作需要,引入combobox多选下拉框,并且获取选择的值并以","分开. 效果如下: 代码如下: <html> <head> <title> ...

  9. Extjs4.2 多选下拉框

    //多选下拉框 Ext.define('MDM.view.custom.MultiComboBox', { extend: 'Ext.form.ComboBox', alias: 'widget.mu ...

随机推荐

  1. python利用文件对话框获取文件路径

    一.单文件 python3: import tkinter as tk from tkinter import filedialog root = tk.Tk() root.withdraw() fi ...

  2. spring-boot 使用Aop通知打印控制器请求报文和返回报文

    一.简介 开发过程中我们往往需要写许多例如: @GetMapping("/id/get") public Result getById( String id) throws Exc ...

  3. jQuery系列 第二章 jQuery框架使用准备

    第二章 jQuery框架使用准备 2.1 jQuery框架和JavaScript加载模式对比 jQuery框架的加载模式 <script> window.onload = function ...

  4. [LeetCode] Count Binary Substrings 统计二进制子字符串

    Give a string s, count the number of non-empty (contiguous) substrings that have the same number of ...

  5. python的字符串

    首先,字符串是python内置的数据类型,其特点是用引号引起来,并且可以是使用单引号('字符串'),双引号("字符串"),三个引号('''字符串''' 和""& ...

  6. Mysql之表的操作与索引操作

    表的操作: 1.表的创建: create table if not exists table_name(字段定义); 例子: create table if not exists user(id in ...

  7. 机器学习技法:02 Dual Support Vector Machine

    Roadmap Motivation of Dual SVM Lagrange Dual SVM Solving Dual SVM Messages behind Dual SVM Summary

  8. day 1——字典树练习

    cojs 173. 词链 ★☆   输入文件:link.in   输出文件:link.out   简单对比时间限制:1 s   内存限制:128 MB [问题描述]给定一个仅包含小写字母的英文单词表, ...

  9. [SCOI 2009]windy数

    Description 题库链接 找出在 \([A,B]\) 间满足相邻位差值至少为 \(2\) 的正整数个数. \(1\leq A,B\leq 2\cdot 10^9\) Solution 数位 \ ...

  10. [PA 2014]Bohater

    Description 在一款电脑游戏中,你需要打败n只怪物(从1到n编号).为了打败第i只怪物,你需要消耗d[i]点生命值,但怪物死后会掉落血药,使你恢复a[i]点生命值.任何时候你的生命值都不能降 ...