1.1 预期效果

在设计报表的过程中，有部分需求需要使用填报控件来实现查询的功能。

如下图所示，下拉框选择地区后列表自动过滤显示所选地区的数据。

1.2 实现方法

在参数界面设置隐藏的下拉框控件，通过编辑后事件，将当前控件的值赋值给参数界面的控件，并执行查询。

2.1 新建报表

2.1.1 新建数据集

新建普通报表，新建数据集 ds1 ，SQL 语句为：SELECT * FROM 销量 where 1=1 ${if(len(area)==0,"","and 地区='" + area + "'")} 

如下图所示：

2.1.2 设计模板

将数据集的字段拖入单元格中，并在 C2 单元格添加一个选择地区的下拉框控件，如下图所示：

2.1.3 设置填报控件

选中单元格中添加的下拉框控件，点击控件设置，设置下拉框控件名为 area，设置下拉框数据字典为销量表中的地区字段，如下图所示：

选择模板>模板 Web 属性>填报页面设置，取消勾选未提交离开提示，并勾选直接显示控件，如下图所示：

2.2 设置参数界面

1）编辑参数界面，添加一个下拉框控件，控件名为 area，并设置控件不可见，如下图所示：

2）点击参数界面空白处，不勾选点击查询前不显示报表内容，如下图所示：

将鼠标放到参数面板的下边框出现双向箭头，按住鼠标左键拖动至顶端，将参数面板的高度设置为 0。

注：当参数面板中有控件时，预览报表默认会显示一个向下的三角按钮，可通过 JS 隐藏参数界面向上向下的三角按钮。

2.3 添加编辑后事件

选中填报控件，添加编辑后事件，输入 JavaScript 代码，如下图所示：

JavaScript 代码如下：

/*获取单元格C2选择的地区控件的值*/
var area1=this.getValue();
/*获取参数面板中的下拉框控件*/
var area2 = contentPane.parameterEl.getWidgetByName("area");
/*给参数面板中的下拉框控件赋值*/
area2.setValue(area1);
/*执行查询*/
_g().parameterCommit();

2.4 预览效果

保存模板，选择填报预览，PC 端预览效果如1.1 预期效果所示。

注：不支持移动端。

已完成的模板，可参见：%FR_HOME%\webapps\webroot\WEB-INF\reportlets\doc\JS\填报预览JS实例\33-JS使用填报页面的控件查询.cpt

点击下载模板：33-JS使用填报页面的控件查询.cpt