简介

AutoForm是一种自动表单，是AutoFormElement的一个集合，内部可以定义多个AutoFormElement:

并且按照ForeLayout的布局形式展现：

其布局特性是FormLayout类似的，如下图的FormLayout:

你可以通过cols属性设定一行可以分几列，其中有可进一步设置每一个AutoFormElement的colSpan和rowSpan属性，使部分AutoFormElement可以实现跨行和跨列布局的特性。

参考文档：

03. FormLayout(SEFC)
TD的colSpan和rowSpan:http://www.htmlcodetutorial.com/tables/index_famsupp_30.html

详细属性说明

autoCreateElements

是否自动根据绑定的EntityDataType自动创建其中的表单元素。所谓绑定的EntityDataType是指：

由AutoForm的dataType属性所指定的EntityDataType
如果没有设定dataType属性，则由dataSet和dataPath属性计算后所对应的DataPath

如果未在AutoForm中定义任何AutoFormElement子对象，但是设置了其autoCreateElements属性为true:

通过以上规则计算得到的EntityDataType为ProductType,那么它就会自动的根据ProductType中的ProertyDef自动创建内部的AutoFormElement对象：

colPadding

表单列之间的留白大小。像素值。

这是colPadding为6的效果图：

这是colPadding为60的效果图：

cols

表单布局的分栏方式。

该属性决定了表单如何分栏，简单的写法有：

表示一个分四列，其中数字表示每一列的宽度。

其中列的宽度既可以使用像素值，也可以使用'*'表示中充满剩余宽度。下面用这种方式定义cols：

其中第二列设置为'*',运行效果如下：

定义分栏方式的基本格式为:列1的宽度[列1的ClassName],列2的宽度[列2的ClassName],.....

列的ClassName不是必须给定的信息，可以省略。如果要省略某列的ClassName，请注意一同省略'['和']'。

例如cols配置为：

CSS设置：

.label-region{
	color: red;
}
.input-region{
	color: blue;
}

运行效果：

可以看到第一列的标题为红色，而第二列的标题为蓝色。

createOwnEntity

是否要自动创建一个私有的Entity，否则AutoForm将尝试使用关联的FormProfile中的Entity。

此属性在createPrivateDataSet为true时或AutoForm绑定DataSet时将失去意义。

TODO: UML说明

createPrivateDataSet

是否要在AutoForm没有实际绑定DataSet时自动创建一个私有的DataSet用于管理表单数据。

由于Dorado中有很多类似于数据校验、键值映射这样的功能都依赖于DataSet，所以如果仅仅使用简单的Entity绑定，AutoForm必然是失去一些功能特性。启用本属性可以让AutoForm自动创建一个私有的DataSet，以便于使用上述各项功能。

对于createPrivateDataSet为true的AutoForm必须设置dataType属性，因为在创建私有DataSet的时候必须指定DataType属性。

对于createPrivateDataSet为true的AutoForm，如果我们通过如下代码获取Entity对象，则它是被这个私有的DataSet所管理的实体对象。

var entity = autoForm.get("entity");

dataPath,dataSet

参考:DataControl(DCUG)AutoForm通过这两个属性的配置，使之绑定到DataSet的一个Entity对象上

dataType

dataType一般情况下不用定义，会自动根据AutoForm的dataSet和dataPath计算出来。

dataType通常的作用有：

autoCreateElements属性为true时，需要获取dataType，并自动生成内部的AutoFormElement对象
当AutoForm未绑定DataSet，且设置了createPrivateDataSet为true,则AutoForm内部创建私有DataSet的时候需要获取dataType配置

entity

AutoForm内部的私有数据对象。

如果AutoForm绑定了DataSet(含createPrivateDataSet为true的情况),则这个Entity对象就是根据AutoForm的dataSet和dataPath所计算出的Entity对象
如果AutoForm未绑定DataSet，但是AutoForm配置了formProfile，则这个entity对象就是FormProfile内部存储的Entity对象
如果AutoForm未绑定DataSet，并且AutoForm未配置formProfile，则是自己私有的Entity对象

根据Dorado数据模型编程的特点，如果我们希望访问AutoForm中的数据，则可以直接访问其内部的Entity对象：

情况一：AutoForm绑定了DataSet(含createPrivateDataSet为true的情况)-Entity方式访问：

var productName = autoForm.get("entity").get("productName");

情况二：AutoForm未绑定DataSet-JSON方式访问:

var productName = autoForm.get("entity").productName;

editorWidth

用于统一设置内部AutoFormElement的文本编辑框的宽度

formProfile

同：FormElement(DCUG)#formProfile

hintPosition,hintSpacing,hintWidth,showHintMessage

用于统一设置内部AutoFormElement的相关提示信息的属性，详情请参考：FormElement(DCUG)

labelAlign, labelPosition, labelSeparator, labelSpacing,labelWidth,showLabel

用于统一设置内部AutoFormElement的相关文本标签的属性，详情请参考：FormElement(DCUG)

rowHeight

默认的行高22,效果如下：

行高改为42，效果如下：

rowPadding

表单行之间的留白大小。像素值。

默认rowPadding为6的效果：

默认rowPadding为1的效果：

stretchWidth

是否将表单的宽度自动扩展为撑满容器。

如下图，我们将AutoForm的stretchWidth设置为true：

我们改变IE窗口的尺寸，使之更大：

这个时候可以看到AutoForm会自适应的变宽。

当然如果将stretchWidth设置为false，就没有这种效果了：

本例是用浏览器窗口的大小说明这种自适应性，在开发中所谓的"是否将表单的宽度自动扩展为撑满容器"，其中的容器及可以是浏览器窗口，也可以是Dorado当中的各种Container类型的控件。

技巧一:动态隐藏内部元素或显示后布局刷新问题

有时候我们动态设置AutoForm的Element元素的可见性后，AutoForm的布局会出现不太整齐的现象，如下图：

我们可以通过调整AutoForm的宽度，从而导致AutoForm自动重新计算布局并刷新解决问题，参考代码：

view.id("form1").set("width", "99%");

Dorado 9 : AutoForm(DCUG)

简介