一个企业可能有数以千计的产品数量，客户也有几百个，使用下拉列表会给填报带来困难。
解决这一问题的比较好的方法是：页面放置一个帮助按钮，通过按钮打开一个窗口，在新打开的窗口中不仅列示大数据量帮助列表，还提供查询过滤功能。
例如，我们建立一个客户的帮助窗口，在这个窗口中可以按照地区对客户进行过滤，也可以按照输入的客户名称关键字进行搜索，当我们选择查询结果时，页面自动把选中的数据回写到合同上……
这是一个很实用的需求，下面我们看一下这样的方式在Appquicker 中如何实现！
本章知识点：
Ð 报表文件如何调用jsp 的javascript 函数
Ð 自定义JSP
Ð TAG 的使用
第一步：修改销售合同单据
在设计器中打开销售合同（contract.raq ），调整界面结构如下：
【属性_ 报表属性】，修改报表样式为普通报表。
插入语由于行式报表不支持HTML数据类型的单元格，所以我们要先把报表样式改为普通报表。
选择A6 ，输入表达式：=to（1，5）
表达式作用to(1,5)在A6中生成从1到5的一个数组，A6被扩展成为5行。
选择B3 ，右键菜单? 填报属性? 常规，是否可写：否，我们要使用帮助窗口来填写合同的客户信息。
选择F6 ，右键菜单? 填报属性? 常规，修改自动计算表达式：${ D6}*${E6} 。
选择D6 ，右键菜单? 填报属性? 校验tab 页，修改校验表达式为：D6.match(/^\d*\.\d{1,2}$|^\d*$/) 。
选择E6 ，右键菜单? 填报属性? 校验tab 页，修改校验表达式为：E6.match(/^\d*\.\d{1,2}$|^\d*$/)。
选择E3 单元格，右键菜单? 数据类型，选择类型8HTML ，在内容栏内输入下述HTML 语句：
<input type=”button” value=”…” onclick=”customer_help()”/>
插入语上面html语句意为：在E3单元格内加入一个按钮，点击按钮时执行javascript函数customer_help()。
customer_help()函数的作用？它在哪里？
修改后的contract.raq要以链接页面的方式进行发布，因为我们要使用帮助按钮打开一个新的窗口，这需要定义一个javascript函数来实现这一功能，这个javascript函数就是上面代码中的customer_help()。我们后面会把这个函数的定义写在装载contract.raq的jsp上。
选择B6 ，右键菜单? 填报属性? 更新tab 页，增加contract 表的更新项。
保存报表contract.raq 。
第二步：建立客户帮助报表
创建一张新的可以填报的普通报表，格式如下，保存为customerhelp.raq 文件。
【配置_ 参数】新增字符串类型参数area ，customer 。
【配置_ 数据集】，新建基于地区表（area ）的SQL 检索数据集ds1 ，另建立一个基于customer 表的复杂SQL 数据集ds2 。Sql 语句如下：
SELECT * FROM customer WHERE (? is null or province=?) and (? is null or customername like ‘%’+?+’%')
切换到参数tab页 ，增加参数列表，area ，area ，customer ，customer 。
插入语现在你能够熟练完成上述配置了吗？如果找不到相关的界面，请复习第九章的内容。
提示SQL中%的作用：”%“是SQL语句中使用的通配符，上面的SQL对客户姓名使用了模糊过滤，作用是从客户列表中过滤出客户名称包含customer参数值的所有记录。
设计器右侧数据集tab页，数据对象选择8列表，展开ds2节点，拖动customerid节点到A3；数据对象选择8取值，拖动customername到B3，linkman到C3,linkduty到D3，province到E3。
选择B1，D1，右键菜单?填报属性?常规,勾选是否可写。
选择B1,右键菜单?填报属性?常规，编辑风格选择下拉数据集，设置：数据集ds1，显示列areaname，数据列areaid。
选择C3，属性区域â显示值â表达式，输入：
ds1.select1(areaname,areaid==value())
选择B3，设置前景色为蓝色，字体带有下划线。
选择E1，右键菜单?数据类型，选择类型8HTML ，在内容栏输入：
<input type=”button” value=”查找” onclick=”customer_search()”/>
插入语javascript函数customer_search()的作用是按照输入的地区和用户名关键字过滤客户表。、
选择B3，属性区域â超链接â表达式，输入：
“javascript:customer_choose(”+A3+”,’”+B3+”‘)”
表达式提示调用页面上的customer_choose（）函数，并把选中的客户编号和名称以参数的形式传给该函数。
保存customerhelp.raq。
第三步：创建JSP
在C:\Program Files\runqianReportCenter\webapps\reportCenter 目录下，新建一个文本文档，保存为contract.jsp ，这里记得修改文件的扩展名, 这个JSP 作用是显示contract.raq 报表文件。
Contract.jsp 内容如下, 请注意实际代码中不要加入行号：
#001 <%@ page contentType=“text/html;charset=GBK” %>
#002 <%@ taglib uri=“/WEB-INF/runqianReport4.tld” prefix=“report”%>
#003 <html>
#004 <body leftMargin=0 top =0 rigtMargin=0 bottonMargin=0>
#005 <report:html name=“report1″ reportFileName=“basic/contract.raq”
#006 funcBarLocation=“top”
#007 />
#008 </body>
#009 </html>
#010 <SCRIPT LANGUAGE=”JavaScript”>
#011 function customer_help()
#012 {
#013 var strurl=”customerHelp.jsp“;
#014 window.open(strurl,“_blank”,“Scrollbars=no,Toolbar=no,Location=no,Direction=no,titlebar=no,Resizeable=no,Width=490 ,Height=500,top=”+(window.screen.height-500)/2+”,left=”+(window.screen.width-500)/2);
#015 return false;
#016 }
#017 </SCRIPT>
插入语为什么我们要自己写jsp？
数据中心装载报表文件的页面是一个模板JSP，当我们需要引入一些javascript函数来执行特定功能（比如点击按钮打开一个窗口）的时候，模板JSP就无能为力了，这需要我们自己定义JSP页面文件，Appquicker提供了发布报表文件的TAG，这些TAG用法简单，容易掌握，下面只对本章用到的tag知识做一个介绍，tag的详细介绍请参见附录。
在介绍代码结构前，希望你已经对HTML的知识能有一个了解，知道HTML界面的主要几个标签如<html>,<body>,<script>，能看懂一般的javascript函数结构就够用了。
contract.jsp包括四部分内容，jsp的文件头，图表按钮，tag发布报表文件，javacript函数customer_help()。
Jsp文件头 ：<%@ page contentType=”text/html;charset=GBK” %>，这一句告诉服务器，以GBK编码的方式输出JSP文件流，<%@ taglib uri=”/WEB-INF/runqianReport4.tld” prefix=”report”%>，这句标志了tag库的位置，声名tag使用时的前缀字符为report。
Tag标签 ：report:html 代表这里要插入一个raq 报表，name 为引入的报表定义一个名称，reportFileName 指定raq 报表文件的位置，funcBarLocation=”" ，报表功能按钮的位置，非必选项，这里置空意思是不显示报表的功能按钮，我们已经自定了上面的图表按钮来实现应有的功能。Html 标签的其它属性设置请参见附录。
函数customer_help()：使用了window.open()方法，打开一个新窗口，并载入指定rul的页面文档。Open()的用法可以查看MSDN的专题介绍，网址：
http://msdn2.microsoft.com/en-us/library/ms536651.aspx
函数customer_help()在新窗口中打开customerHelp.jsp,这个JSP我们将在下面定义。
创建customerHelp.jsp
在C:\Program Files\runqianReportCenter\webapps\reportCenter 目录下，另建customerHelp.jsp, 注意文件名中大写H 。
customerHelp.jsp 内容如下：
#001 <%@ page contentType=“text/html;charset=GBK” %>
#002 <%@ taglib uri=“/WEB-INF/runqianReport4.tld” prefix=“report”%>
#003 <html>
#004 <body leftMargin=0 top =0 rigtMargin=0 bottonMargin=0>
#005 <report:html name=“report1″ reportFileName=“basic/customerhelp.raq”
#006 funcBarLocation=“”
#007 params=“<%=request.getParameter(”params”)%>”
#008 />
#009 </body>
#010 </html>
#011 <SCRIPT LANGUAGE=”JavaScript”>
#012 function customer_search()
#013 {
#014 var strurl=“customerHelp.jsp?params=area=”+document.getElementById(”report1_B1″).value+”;customer=”+document.getElementById(”report1_D1″).value;
#015 window.location=strurl;
#016 }
#017 function customer_choose(A3,B3)
#018 {
#019 opener.document.getElementById(‘report1_B3′).innerText=B3;
#020 opener.document.getElementById(‘report1_B3′).value=A3;
#021 window.close();
#022 return false;
#023 }
#024 </SCRIPT>
编码说明 ：tag 中的params=“<%=request.getParameter(”params”)%> 语句作用是：获取url 变量params 字符串，并用获取的值给tag 的params 属性赋值。这样customerhelp.raq 的area 和customer 参数就从params 属性中获得初始值。
函数customer_search() 作用：重新载入自身页面文件（customerHelp.jsp ），在载入之前，取得当前页面上的地区和用户名称关键字，形成params 参数，在载入页面时一并提交。
Window.location ，当前窗口中重新载入指定的url 。
函数customer_choose(A3,B3) 作用：用取得的参数对父窗口的B3 单元格进行赋值。
opener.document.getElementById(‘report1_B3′).innerText ，替换report1_B3 对象的起始和结束标记中间的内容，也就是设定report1_B3 的显示值。
report1_B3是什么？
由填报表模板生成的HTML中，一个填报表相当于一个<Table>,而每一个子元素<td>,都会自动生成id属性，其属性值的命名规则是，id=”tag的name属性值_单元格号“，如id=”report1_B2″,我们要在页面中用脚本取得或者修改单元格的值，可以根据这个id很容易做到，例如，要取得B2单元格的值，用javascript在页面中可以这样取得var B2Vlalue = document.all[’report1_B2′].value。
opener.document.getElementById(‘report1_B3′).value ，对report1_B3 对象赋值。
window.close() ：关闭当前窗口。
注意到了吗？
Customerhelp页面的实现思路是：通过contract页面打开customerhelp窗口，这是可以输入查询条件进行过滤，每点击一次查找按钮，页面就根据查询参数重新载入一次，传递到后台的参数成为SQL查询的依据。对新载入的页面，用户可以直接点击某个客户名称，这时系统把该客户的编号和名称都返回到contract页面，更新客户编辑框的显示内容和值，同时关闭customerhelp窗口。理解了吗？重新理一理这一章的操作步骤吧！
删除单据专题
或许看到这里你已经产生了疑问，页面上并没有给出删除按钮，如果我想在打开一张非列表形式单据同时删除它该怎么实现？现在程序中还没有提供删除一个单据的功能，这个问题只有想想变通的解决方案了！
思路在合同的数据库表contract中加入一个字段del_flag，类型int，作为一条记录的删除标志，在合同报表上，增加一列，把这列的宽度设置为0（不显示），我们在合同报表所在的jsp上加入一个javascript函数，函数内容如下：
function del_func()
{
var i=5
var value_object=
document.getElementById(’report1′).rows(i).cells(5).innerText
while(value_object)
{
document.getElementById(’report1′).rows(i).cells(5).innerText=1
document.getElementById(’report1′).rows(i).cells(5).value=1
i=i+1;
value_object=document.getElementById(’report1′).rows(i).cells(5).innerText
}
_submitTable( report1 )
return false; }
其中的_submitTable( report1 ) 函数是系统提供的强提交函数，用它我们把修改后的数据向服务器提交，函数的主体功能是设置报表上新增加列的值为1，这样，我们就可以在查询时判定这张合同是不是已经被删除了。下面我们在页面上增加一个按钮来调用这个函数，试一下，这样的效果是否达到删除功能的要求。
第四步：发布链接
登录数据中心控制台，选择报表发布，在字典维护节点下新增节点：节点类型 超链接，节点名称 销售合同2 ，此节点对应的超链接 选择系统功能连接，编辑框内输入：
/contract.jsp
以/ 开头表示相对于WEB 应用的根目录
登录数据中心首页，选择销售合同2 节点，看到客户帮助的功能了吗？有了这个界面，再多的数据也可以搞定了。
