简述

Web开发中，很多对于日期型数据的输入的页面中都会提供一个日历选择框，如下图:

图表 3 日历选择
dorado也专门提供了日历，上图就是dorado的日历效果图,在通常的dorado页面开发中，一般都是通过设定相关字段的dataType为date或datetime即可实现，在系统运行时，一但光标定位在某个编辑框上，而且这个编辑框绑定的字段的数据类型为date或datetime，则系统会自动的创建一个日历并作为该编辑框的下拉框而存在。这种开发对于开发人员是非常容易设定和省事的。

常用技巧

基本技巧参考ListDropDown的常用技巧

对当前日期加减天数计算

var date = datasetEmployee.getValue("birthday");
var oldTime = date.getTime();//返回从 1970 年 1 月 1 日开始计算到 Date 对象中的时间之间的毫秒数
var newTime = oldTime + 5*24*3600*1000; //将当前日期加5*24小时*3600秒*1000毫秒
var newDate = new Date();
newDate.setTime(newTime);
datasetEmployee.setValue("birthday",newDate);

自定义DateDropDown对象的onSelect事件

在默认情况下DateDropDown是由系统自动创建和管理的，我们可以通过如下的方式管理和控制DateDropDown对象
创建一个自定义的DateDropDown对象，并在Studio的事件列表中添加onSelect事件代码,之后将该下拉框绑定到相关的Field上，注意onSelect事件的声明:

public Boolean onSelect(DropDown dropdown, Object selectedObject, TextEditor editor)

其中第二个参数就是用户选中的Date对象。

动态编程

在前面提到的例子中DateDropDown中的元素我们都是在xml文件中静态配置的,或则系统自动生成，下面我们看看如何动态的初始化DateDropDown对象,在dorado的视图模型实现类中我们提到过initControls函数，下面我们就利用initControls函数初始化DateDropDown

在服务器段动态生成DateDropDown

protected void initControls() throws Exception {
super.initControls();//系统默认函数,注意保留
DatetDropDown dropdown1= (DateDropDown)createControl("DateDropDown","dropdown1");
dropdown1.setFixed(true);
}

使用视图模型实现类提供的createControl方法创建DateDropDown对象，注意第一个参数用以指定组件的类型,第二个参数指定新建对象的id

在服务器端获得View(视图模型)中定义的DatasetDropDown,并动态它的属性

protected void initControls() throws Exception {
super.initControls();//系统默认函数,注意保留
DatasetDropDown dropdown1= (DatasetDropDown)getControl("dropdown1");
dropdown1.setFixed(true);
}

在上面的代码中可以看到通过实现类提供的getControl函数获得我们需要的组件对象，所需要的就是给它一个DatasetDropDown对象的id,注意开发时我们建议您直接在View的设计中添加一个默认的DatasetDropDown，这样我们就可以在initControls方法中通过getControl发发获得这个默认的DatasetDropDown对象，并利用该对象提供的API进行各种设定和初始化的工作，如DatasetDropDown的setFiexed方法设定它的锁定功能。

主要属性说明

属性参考ListDropDown

主要事件说明

基本事件参考ListDropDown

事件	说明
public Boolean onSelect(DropDown dropdown, Object selectedObject, TextEditor editor)	当选择了下拉数据时触发此事件的返回值用于通知系统是否要继续完成后续为编辑框或数据集赋值的操作.返回true表示继续默认的赋值操作. 参数说明: dropdown - 触发事件的下拉框对象 selectedObject - 在下拉框中被选中的日期对象 editor -打开此下拉框的编辑框对象

CSS说明

日历控件的主要css申明如下，系统美工人员参考:

名称	说明
.Calendar	日历整体
.Calendar .Header	日历头
.Calendar .Header .Button	日历导航按钮
.Calendar .Footer	日历脚
.Calendar .CalendarTable	日历体
.Calendar .CalendarTable .Header	日历体中的标题
.Calendar .CalendarTable .CurrentMonth	日历体中当前月份
.Calendar .CalendarTable .CurrentMonth .Content	日历体中当前月份内容
.Calendar .CalendarTable .PrevMonth	日历体中当前月份前一月份
.Calendar .CalendarTable .PrevMonth .Content	日历体中当前月份前一月份内容
.Calendar .CalendarTable .NextMonth	日历体中当前月份后一月份
.Calendar .CalendarTable .NextMonth .Content	日历体中当前月份后一月份内容
.Calendar .CalendarTable .CurrentDay	日历体中当前日期

Dorado 5 : 1.2.3.DateDropDown(日期下拉框) (RF2)

简述