280bea3e3a7f680b10fbaa8ccd961f46d6ef6585.svn-base 7.19 KB

Raw Blame History Permalink

<HTML>
<head>
<title>附录.数据源实例</title>
<meta http-equiv="content-type" content="text/html; charset=gb2312">
<link rel="stylesheet" href="../temp1.css" type="text/css">
</head>
<body bgcolor=#ffffff vlink=#0000ff>

<Table cols=2 border=0 width=100%>
<col width=60%>
<col width=40%>
<tr height=91><td/><td><img src='../../res/tradereport.jpg'></td></tr>
</table>
<h3>　<font color=#3366ff>附录：数据源实例</font></h3><hr color=#2266ee size=1>
　　数据源是Supcan Report最重要的功能，Supcan Report在设计之初，就是定位于报表模板的。<br>
　　本文采用图解、step by step的方式完成报表中数据源的创建和使用，并分析数据源的工作原理，您只要按照本文提示也跟着做一遍就算入门了。<br>
　　数据源分中心数据源和临时数据源，其中临时数据源相对简单些，那我们就从简单的地方入手吧。<br>
<br>
<b>Step 1.准备空白报表</b><br>
　　我们从空白报表设计开始，以demo中的第一个演示页作为报表的设计器，请进入演示页“1.体验硕正报表”。<br>
　　先用鼠标右键点击左下角的“工作表1”，选择菜单中的“删除当前工作表”：<br>
<center><img src="reportds1.jpg"/></center>
　　然后，点击左上角工具条<img src="Toolbar1.bmp"/>中的第一个：“新建”;<br>
<br>
　　在新表的默认格式对话框中，将尺寸改成5行、5列就行，因为数据将会从数据源填入，所以空表不需要太多的行：<br>
<center><img src="reportds3.jpg"/></center>
　　你可看到一个5行、5列的空白表了。<br>
　　点击左上角的“另存为...”图标，将空表保存一下，例如保存到"d:\myReport.xml"<br>
<img src='glass.jpg'><font color="552222">你会发现报表中其实共有6行、6列，这是因为每个单元格只有左、上边界，而没有右、下边界，所以多出一行一列用于给报表的表格线封口！</font><br>
<br>
<br>
<b>Step 2.适当修饰空白报表</b><br>
　　鼠标点击左侧标尺中的“1”， 用以选中第一行，然后点击工具条中中间偏右的“单元合并”，以合并整个第一行的单元格：<br>
<center><img src="reportds4.jpg"/></center>
　　重复这个操作，把第二行、第三行也分别合并掉。<br>
　　同时选定1、2、3行，在工具箱中将其左边界、上边界都设为0， 因为这将是报表的表头：<br>
<center><img src="reportds5.jpg"/></center><br>
　　直接在单元格中输入表头文字，并用工具条的功能设置字体、对齐，最后报表如下，保存之：<br>
<center><img src="reportds6.jpg"/></center><br>
<br>
<br>
<b>Step 3.准备数据源示例数据</b><br>
　　硕正报表在设计数据源时，需要一个示例数据源的帮助。以XML类型的数据源为例，我们假设demo包中reportdata目录下的文件 data1.xml 就是示例数据源，暂且先不管真实运行环境下是不是这个文件。<br>
　　你可以用IE打开这个文件看一下，会发现这其实就是常见的XML格式的结果集数据。<br>
<br>
<b>Step 4.定义数据原</b><br>
　　点击工具条右侧的“数据源”图标，在对话框中的工具栏中选择“新建\临时数据源\XML”：<br>
<center><img src="reportds7.jpg"/></center><br>
　　然后在向导窗中输入示例数据源的相对URL "reportdata/data1.xml"(相对于页面)，当然也可以输入绝对URL，甚至是本地的文件名：<br>
<center><img src="reportds8.jpg"/></center><br>
　　请注意“数据源名称(ID)”，默认是ds1，这是该数据源的ID，因为一张报表中可能会需要多个数据源；“含义”相当于是这个数据源的含义简称，下面将会提到。<br><br>
　　点击"下一步"后，会发现这个XML被解析出來了：<br>
<center><img src="reportds9.jpg"/></center><br>
　　上方是被解析出來的树，其中打勾处表示被硕正软件自动辨别为记录级的XML节点(XML可以包含多层节点);<br>
　　下方是重点的内容：第一行相当于是列名，你不能轻易修改它；第二行是数据类型，你必须逐个列修改，因为默认都是 string 型的；第三行相当于是标题，一般都是中文，所以也应该逐个修改，比如修改成象上图中的那样.<br>
　　然后，点击“下一步”直至“完成”，按“确定”退出对话框，保存报表。<br>
　　至此，你的报表中已经定义了一个数据源，只是您尚未使用它。<br>
<br>
　　你用IE直接打开myReort.xml模板文件，会发现多了一段名为"DataSource"的内容：<br>
<center><img src="reportds10.jpg"/></center><br>
　　可见定义好的数据源已经保存在模板中了，至于这个XML的具体语法，你根本不必过多探究它，这是硕正软件生成的。<br>
<br>
<b>Step 5.使用数据源</b><br>
　　下面将使用数据源。<br>
　　打开myReport.xml报表，点击工具条中的“工具箱”，再点击工具箱上方的“使用数据源”，就应该是如下的界面了：<br>
<center><img src="reportds11.jpg"/></center><br>
　　右侧的“货运数据”就是这个数据源的含义简称；“单个数据”下的就是各个数据列了。<br>
　　用鼠标将“表”中的“标题行”直接拖入A4单元格、将“数据行”直接拖入A5单元格，看到什么了？ 数据被填入报表了!<br>
<img src='glass.jpg'><font color="552222">拖入时，会出现“列数少于数据源的列数，是否自动添加列？”的提问，因为我们的空表才5列！</font><br>
<br>
　　保存报表。<br>
　　此时你可能会感到非常惊讶：怎么填入的数据瞬间又不见了？<br>
　　因为硕正报表默认是当作模板的，而模板是不含数据的！此时的报表就已经是真正的模板了！<br>
　　如果你想再看一看刚才的数据，点击工具条中“数据源”旁边的齿轮"重新计算"，发现数据又被填入了.<br>
<br>
<b>Step 6.原理分析</b><br>
　　用鼠标点击A4单元格，发现这个单元格在上方的输入框中有一个函数：=headrow('ds1')， A5单元格则为：=datarow('ds1')<br>
　　其实这就是你刚才把“标题行”和“数据行”拖入这2个单元格的结果！<br>
　　换句话说，你手工在这2个单元格中敲入这2个函数，和用鼠标象刚才那样拖入，<font color=red>其结果是完全一样的!</font><br>
　　不用我们解释，你应该知道函数中的参数'ds1'是什么吧？<br>
<br>
<b>Step 7.部署模板</b><br>
　　把这个myReport.xml模板文件部署到服务器，比如拷贝到report目录下，然后在页面的OnReady( id )事件中书写：<br>
<pre class='xml'>
function OnReady(id) {
 AF.func("Build", "report/myReport.xml");
}</pre>
　　页面中就呈现这个模板了。<br>
<img src='glass.jpg'><font color="552222">拷贝文件属于静态部署，您也可以动态部署(在线编辑)，方法请参照"常见问题解答\5.Report组件"中的问1.</font><br>

<br>
<b>Step 8.加载真实数据</b><br>
　　这个模板是不含数据的，它顶多包含一个示例数据URL，所以在运行时需要将真正的数据URL赋予给它：函数 SetSource 能完成这个功能，例如：<br>
<pre class='xml'>
function OnReady(id) {
 AF.func("Build", "report/myReport.xml");
 //指定ds1数据源取数的URL地址
 AF.func("SetSource", "ds1 \r\n http://localhost/daldata/orders.aspx?year=2011&mon=12");
 //需要重新计算， 因为SetSource仅仅是相当于更改一个属性
 AF.func("Calc", "");
}</pre>
<img src='glass.jpg'><font color="552222">orders.aspx返回的必须是纯XML数据，格式要和示例数据源文件中的一致.</font><br>
<img src='glass.jpg'><font color="552222">如果orders.aspx先于模板存在，在设计模板时也可以直接使用该aspx作为示例数据源的.</font><br>
<img src='glass.jpg'><font color="552222">如果不执行SetSource函数，报表将默认采用模板设计时的示例数据URL.</font><br>
　　OK, 至此，您应该已经了解数据源的大致原理了，这只是入门，您可以对照我们的demo页深入使用和分析，了解诸如多数据源、单个XML文件多节点数据源、其它类型的数据源、中心数据源、带参数的数据源、数据列顺序、数据列隐藏、数据的客户端排序、表头表体分别来自不同数据源等高级内容。<br>
<br>
<b>Step 9.分页打印</b><br>
　　如果您直接就打印/预览，可能你会很失望：垂直分页时，从第二页开始根本就没有你期望的表头！<br>
　　请使用工具条的“打印设置”功能，在“分页(1)”中启用垂直分页，并让前4行作为固定的表头：<br>
<center><img src="reportds12.jpg"/></center><br>
　　您再预览一下，应该就是您所期望的了！<br>
　　“打印设置”对话框中选项多多，建议您今后逐步去了解它们，在实际开发、实施中这些选项都是很有用的。<br>
　　“打印设置”后，别忘了保存报表，这样这些打印选项就保存到报表模板中了！<br>
<br>
<b>Step 10.分类汇总、交叉表</b><br>
　　在工具条"数据源"图标的下拉中，有“分类汇总”、“交叉表”的功能，这些功能都是根据数据源的平面数据，在客户端完成再计算的。<br>
　　你可以参照相关的demo页，试着设置分类汇总、交叉表、统计图等等，感受单调的数据、以不同的格式展现出來的强大功能。<br>

<br><br><br><br><br><br>
<script type='text/javascript' src='nstd.js'></script>
</body></html>