构建 SkinDataForm 类的新实例。
全称 | mx.datacontrols.SkinDataForm |
命名空间 | mx.datacontrols |
类 | SkinDataForm |
继承层次结构 | SkinDataFormDataFormControl |
源文件 | ~\mx\scripts\datacontrols\SkinDataForm.js |
HTML 代码 |
<table>
<tr>
<td align="right">
姓名:
</td>
<td>@#@AV-empName#OPTIONS-{editorType:"TextEditor", readOnly: true}</td>
</tr>
<tr>
<td align="right">
性别:
</td>
<td>@#@AV-empSex#OPTIONS-{width:500, editorType:"DropDownEditor"}</td>
</tr>
</table> |
JavaScript 代码 |
var userData = { MC: "小明", XB: "f", MZ: "汉", CYM: "明明", CSSJ: parseDate("1984-3-1") };
var userMeta = [
{name: "id", caption: "ID", nullable: false, readOnly: true},
{name: "name", caption: "名称", nullable: true},
{name: "age", caption: "年龄", nullable: true},
{name: "gender", caption: "性别", nullable: true},
{name: "birthday", caption: "出生日期", nullable: true}
];
var formEntityContainer = new mx.datacontainers.FormEntityContainer(
{ baseUrl : "http://lqr-pc:8081/mx.framework/rest/getData",
priaryKey:"id"} ); // 表单数据容器为 mx.datacontainers.FormEntityContainer 类型
var skinDataForm = new mx.datacontrols.SkinDataForm({
skinUrl:"http://lqr-pc:8081/mx.framework/myWeblet/SkinFile.html",
entityContainer: formEntityContainer
}); |
名称 | 说明 |
SkinDataForm() | 构建 SkinDataForm 类的新实例。 |
名称 | 说明 |
alias | 获取或设置一个字符串,表示控件的别名。 |
baseUrl | 详见 DataGrid.baseUrl 属性。 |
border | 获取控件的边框样式。如“1px solid red”,表示边框的样式为 1 像素红色的实线。请使用 setBorder 方法设置该字段的值。 |
bottom | 获取控件的下边界与父容器下边界的像素距离。请使用 setBottom 方法设置该字段的值。 |
captionColumnWidth | 获取标题列的宽度。 |
cssClass | 指定css伪类名称,设置控件显示样式 |
display | 获取控件的显示样式值。如“none”,表示隐藏控件; “block”表示强制作为块对象呈递。请使用 setDisplay。注:该"block"值不能在ComplexGrid控件中使用。 方法设置该字段的值。 |
displayPrimaryKey | 获取或者设置一个 Boolean 值,该属性表示是否需要显示表单中的主键字段。 |
editors | 模板加载完成后。 |
enabled | 获取控件是否可以对用户交互作出响应。如果该值为 true,则表示控件可以对用户交互作出响应;反之则不能。 请使用 setEnabled 方法设置该字段的值。 |
entityContainer | 获取一个 FormEntityContainer 对象(通常是 FormEntityContainer 类型),表示表单的数据源。 请使用 setEntityContainer 方法设置该字段的值。 |
eTag | 获取控件的标签。 |
fieldCaptionRender | 设置或获取一个函数,用来自定义表单中字段的标题显示方式。 函数需要返回一个 JQquey 对象或者一个 HTML 片段,返回值将用作字段的标题。 |
fields | 获取一个具有层次关系的集合,包含当前表单中所有字段(FormField)和字段分组(FormFieldGroup)信息。 另请参考 allFields 字段。 |
groups | 获取一个集合,包含表单中所有的编辑器(FormFieldGroup 类型)。 |
height | 获取控件的高度。可以是数字(如 500)、字符串(如“500px”或“50%”)。请使用 setHeight 方法设置该字段的值。 |
ignoreCheckOnHide | 一个Boolean值,表示是否忽略隐藏编辑器的校验,如果为true,则忽略,flase为校验 |
isCache | 获取和设置一个 Boolean 值,表示获取模板时是否使用缓存。false 表示不使用,反之使用。 |
isForm | 获取和设置一个 Boolean 值,表示控件是否是表单控件,false 表示该控件不是表单控件,反之是表单控件,将和 EntityContainer 绑定使用。 |
layoutConfigs | 获取或者设置一个 JSON 对象,该属性表示控件在父容器中的布局配置参数。该属性只有在控件父容器运用布局器才会生效。 |
left | 获取控件的左边界与父容器左边界的像素距离。请使用 setLeft 方法设置该字段的值。 |
maxCols | 获取和设置单行中最大列宽度总数。 |
padding | 获取控件的内边距。如“4px”表示上下左右的内边距均为 4 像素; “4px 2px 3px 1px”则表示上边距为 4 像素,右边距为 2 像素,下边距为 3 像素,左边距为 1 像素。请使用 setPadding 方法设置该字段的值。 |
parent | 获取控件所属的父对象。 |
permissionID | 获取或设置一个字符串,表示控件的权限标识。 |
position | 获取控件位置样式值。如“static”,表示无特殊定位,对象遵循 HTML 定位规则。请使用 setPosition
方法设置该字段的值。
该字段的可选值包括:
|
primaryKey | 详见 DataGrid.primaryKey 属性。 |
printHideFields | 是否打印默认隐藏的字段。 |
right | 获取控件的右边界与父容器右边界的像素距离。请使用 setRight 方法设置该字段的值。 |
skinUrl | 设置或获取模板的路径 URL。 |
top | 获取控件的上边界与父容器上边界的像素距离。请使用 setTop 方法设置该字段的值。 |
visible | 获取一个 Boolean 值,表示控件是否可见。如果该值为 true,则表示控件可见;反之则不可见。请使用 setVisible 方法设置该字段的值。 |
width | 获取控件的宽度。可以是数字(如 500)、字符串(如“500px”或“50%”)。请使用 setWidth 方法设置该字段的值。 |
$e | 获取该控件的占位符,该占位符为一个 JQuery 对象。 |
名称 | 说明 |
onload | 当表单加载完数据后触发该事件。 |
onloading | 当数据容器开始加载数据时,将触发该事件。调用 load 方法时会触发该事件。 |
onrendering | 加载数据之后,表单渲染之前将触发该事件。 |
onskinload | 当皮肤加载完成后,将触发该事件。 |
onsubmit | 当表单提交是触发该事件。 |
onvalidate![]() |
当验证表单输入时将触发该事件。调用 validate 方法时会触发该事件。可通过订购该事件,实现对表单的自定义验证。 |
该字段的可选值包括:
JavaScript 代码 |
var entityContainer = new mx.datacontainers.FormEntityContainer(
baseUrl: mx.mappath("~/user")
);
var form = new mx.datacontrols.DataForm({
entityContainer: entityContainer,
fields: [
{ name: "userName", caption: "用户名", nullable: false },
{ name: "password", caption: "密码", textMode: "password", nullable: false },
{ name: "confirmPassword", caption: "密码", textMode: "password", nullable: false }
]
});
entityContainer.load();
form.on("validate", function(e)
{
// e.param,待校验的表单数据。
// e.dataForm,当前表单信息。
var entityContainer = form.entityContainer;
if (entityContainer.getValue("password") != entityContainer.getValue("confirmPassword"))
{
// 通过事件参数传递校验结果
e.successful = false;
e.hint = "两次输入的密码不一致。";
}
}); |