HelloWorld-1 展现

从<Show me the World>章节，我们学习到了如何进行基本的dorado开发，然而其中并未涉及到Web项目的最大的根本，即数据的交互和页面中的数据展现。本书中从第5章至第8章，主要以HelloWorld示例进行四部分的示例讲解。在<展现>章节中主要讲解了基本的数据绑定控件在页面的显示及联动效果；<调整>章节中主要讲解了如何在已经新建完成的视图模型及JSP页面中添加控件；<更新>章节则主要演示了快速实现客户端数据执行增删改之后如何提交至服务器端并在数据库表中保存；最后，在<查询>章节则讲解了如何使用dorado提供的QueryCommand查询命令控件实现对数据的过滤查询功能。

图5-01

新建视图模型

在开发平台左边sample项目下的【src】目录下新建ViewModel。命名为helloWorld。
图5-02

配置数据集对象

在【Datasets】节点上新建AutoSqlDataset。步骤：【view】—>【Datasets】—>【Insert】—>【AutoSqlDataset】。

图5-03
在打开的【Select the Table】窗口中选择表【EMPLOYEE】。

图5-04
点击【Next】，打开【Add the Join Table】窗口。

图5-05
点击【>>】选择所有的列，完成从Table中Column到Dataset中Field的映射。

图5-06
点击【Finish】之后，完成Dataset的配置。

图5-07

配置展现形式

在【Controls】节点下新建AutoForm控件。步骤：【Controls】—>【Insert】—>【Form】—>【AutoForm】。

图5-08
在【Set Properties】窗口，设置AutoForm的dataset属性值为datasetEmployee，设置Auto create elements为√。

图5-09
点击【Finish】完成AutoForm的配置。

图5-10
同样，在【Controls】节点下新建DataTable控件。步骤：【Controls】—>【Insert】—>【Table】—>【DataTable】。

图5-11
在【Set Properties】窗口，设置DataTable的dataset属性值为datasetEmployee，设置Auto create elements为√。

图5-12
点击【Finish】完成DataTable的配置。

图5-13
我们还需要一个控件进行数据集中的记录滚动以及翻页控制。在dorado的控件集合中，DataPilot导航条控件可以实现该功能。在【Controls】节点下新建DataPilot控件。步骤：【Controls】—>【Insert】—>【Pilot】—>【DataPilot】。

图5-14
在【Set Properties】窗口，设置DataPilot的dataset属性为datasetEmployee。

图5-15
点击【Finish】完成DataPilot的配置。

图5-16

创建JSP页面展现效果

在helloWorld的view节点下通过【Generate a sample JSP】新建ViewModel的相关JSP页面。步骤：【右键view】—>【Generate a sample JSP】。

图5-17
通常，dorado会根据ViewModel的命名自动生成JSP页面的文件名，同时也可以根据命名规范修改文件名。

图5-18
点击【Finish】完成hello_world.jsp页面的创建。

图5-19
保存全部新建工作，在Tomcat服务已经启动的情况下。右键点击JSP页面，通过【Browse】在浏览器中查看页面。

图5-20
该页面支持开箱即用的功能，如支持表单、表格、按钮导航条的数据联动显示，支持鼠标方式调整表格列的顺序、宽度等，这些都是dorado中默认实现的功能。如图5-21所示DataTable的属性窗口【DataTable Properties】。

图5-21

开发步骤

简单回顾一下，在<Show me the World>章节，我们新建了ViewModel视图模型之后，直接为ViewModel添加新建的控件。本章是在新建ViewModel视图模型之后，首先新建AutoSqlDataset实现数据加载，然后新建AutoForm、DataTable和DataPilot控件并设置了数据集对象与控件之间的绑定，实现数据的展现功能。

开发步骤
第一步：新建ViewModel视图模型。	第二步：新建Dataset数据集对象。
第三步：新建AutoForm控件并绑定Dataset。	第四步：新建DataTable控件并绑定Dataset。
第五步：新建DataPilot控件并绑定Dataset。	第六步：新建相关JSP页面。
详细步骤图

小测验

关于绑定Dataset，下面说法错误的是（）【单选】
A）绑定Dataset的控件可以实现数据联动效果。
B）在同一个ViewModel中，即使不绑定Dataset，也可以实现数据联动效果。
C）修改已经绑定Dataset的AutoForm中的数据，绑定Dataset的DataTable控件也可反映出被修改情况。
D）绑定Dataset的DataPilot控件执行记录滚动操作时，可同时在绑定同一个Dataset中的AutoForm和DataTable中看到记录滚动效果。

小结

本章中新建视图模型之后，第一步即新建Dataset数据集对象。在Web应用中，数据是贯穿其中的重中之重。Dataset数据集对象是dorado中的核心部分。作为数据的载体，它承担了大量的前后台数据的交互、客户端数据集与控件的互动及其他相关数据处理等功能，后面的章节中我们会专门讲到Dataset的原理作用。

Dorado 5 : 05.HelloWorld-1 展现 (T1)