tesia
- 浏览: 33279 次
- 性别:
- 来自: 广州
-
最新评论
Ext.form.FieldSet 扩展自Ext.container.Container组件，是一个标准的字段容器，默认布局为‘anchor’ ，也可以指定为其他布局。
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>字段集</title>
<link rel="stylesheet" href="ext-4.2.1/resources/css/ext-all.css" />
<script type="text/javascript" src="ext-4.2.1/bootstrap.js"></script>
<script type="text/javascript" src="ext-4.2.1/locale/ext-lang-zh_CN.js"></script>
<script type="text/javascript">
Ext.onReady(function(){
Ext.create('Ext.form.Panel',
{
title:'Ext.form.FieldSet示例',
labelWidth:40,
width:200,
frame:true,
renderTo:Ext.getBody(),
bodyPadding:5,
items:[{
title:'产品信息',
xtype:'fieldset',
collapsible:true,//显示切换展开收缩状态的切换按钮 collapsible用来设置字段集是否可以折叠
bodyPadding:5,
defaults:{
labelSeparator:':',
labelWidth:50,
width:160
},
defaultType:'textfield',
items:[{
fieldLabel:'产地'
},
{
fieldLabel:'售价'
}]
},
{
title:'产品描述',
xtype:'fieldset',
bodyPadding:5,
checkboxToggle:true,//显示切换展开收缩状态的复选框
//（ checkboxToggle 设置是否显示字段集的checkbox选择框，可以实现隐藏或显示字段集的功能）
checkboxName:'description', //提交数据时复选框对应的name
labelSeparator:':',
items:[{
fieldLabel:'简介',
labelSeparator:':',
labelWidth:50,
width:160,
xtype:'textarea'
}]
}
]
}
);
});
</script>
</head>
<body>
</body>
</html>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>字段集</title>
<link rel="stylesheet" href="ext-4.2.1/resources/css/ext-all.css" />
<script type="text/javascript" src="ext-4.2.1/bootstrap.js"></script>
<script type="text/javascript" src="ext-4.2.1/locale/ext-lang-zh_CN.js"></script>
<script type="text/javascript">
Ext.onReady(function(){
Ext.create('Ext.form.Panel',
{
title:'Ext.form.FieldSet示例',
labelWidth:40,
width:200,
frame:true,
renderTo:Ext.getBody(),
bodyPadding:5,
items:[{
title:'产品信息',
xtype:'fieldset',
collapsible:true,//显示切换展开收缩状态的切换按钮 collapsible用来设置字段集是否可以折叠
bodyPadding:5,
defaults:{
labelSeparator:':',
labelWidth:50,
width:160
},
defaultType:'textfield',
items:[{
fieldLabel:'产地'
},
{
fieldLabel:'售价'
}]
},
{
title:'产品描述',
xtype:'fieldset',
bodyPadding:5,
checkboxToggle:true,//显示切换展开收缩状态的复选框
//（ checkboxToggle 设置是否显示字段集的checkbox选择框，可以实现隐藏或显示字段集的功能）
checkboxName:'description', //提交数据时复选框对应的name
labelSeparator:':',
items:[{
fieldLabel:'简介',
labelSeparator:':',
labelWidth:50,
width:160,
xtype:'textarea'
}]
}
]
}
);
});
</script>
</head>
<body>
</body>
</html>
- 大小: 11.2 KB
0
顶
顶
1
踩
踩
分享到：
发表评论
-
Ext.data.TreeStore 分级异步加载树节点示例
2013-07-10 15:36 2068Ext.data.TreeStore远程加载树节点有两种常用方 ... -
Ext.Ajax.request提交JSON数据
2013-07-10 09:29 1356JSON作为轻量级的数据传输格式，在很多时候可以作为XML文件 ... -
Ext.Ajax.request提交XML数据示例
2013-07-09 16:51 938服务器端：loginServerXml.jsp 在lib下要有 ... -
Ext.Ajax.request异步提交表单示例
2013-07-09 16:10 1047服务器端代码：loginServer.jsp <%@ ... -
树形面板Ext.tree.Panel
2013-07-05 15:19 644<!DOCTYPE html PUBLIC " ... -
relayEvents传播分发事件
2013-07-04 14:17 693<!DOCTYPE html PUBLIC " ... -
Extjs自定义事件
2013-07-04 10:54 434<!DOCTYPE html PUBLIC " ... -
改变文档样式风格示例
2013-07-04 10:55 772<!DOCTYPE html PUBLIC " ... -
ExtJS事件绑定方式示例
2013-07-04 10:55 672<!DOCTYPE html PUBLIC " ... -
Ext.util.JSON编码和解码JSON对象
2013-07-03 15:27 941<script type="text/java ... -
Ext.util.Format提供的常用格式化方法
2013-07-03 14:57 1326<!DOCTYPE html PUBLIC " ... -
Ext.util.ClickRepeater 事件的配置和触发
2013-07-03 11:55 745Ext.util.ClickRepeater 继承Ext.ut ... -
样式表的创建和规则获取示例
2013-07-03 10:44 514<!DOCTYPE html PUBLIC " ... -
Ext.KeyNav为元素提供简单的按键处理方法示例
2013-07-03 09:46 844<!DOCTYPE html PUBLIC " ... -
Ext常用函数
2013-07-01 16:42 626函数一：Ext.onReady（） Ext的Dom都是动态生成 ... -
水平盒布局HBox
2013-07-01 15:43 481<!DOCTYPE html PUBLIC " ... -
表格布局
2013-07-01 15:18 519<!DOCTYPE html PUBLIC " ... -
Ext.layout.container.Column布局
2013-07-01 15:18 743<script type="text/java ... -
Absolute绝对位置布局示例
2013-07-01 14:35 395Ext.layout.container.Absolute对应 ... -
Card 卡片式布局
2013-06-28 16:40 949<!DOCTYPE html PUBLIC " ...
相关推荐
6. `fieldset`：`Ext.form.FieldSet`是用于组织和分组表单字段的容器，通常包含一个标题和可选的边框。 7. `hidden`：`Ext.form.Hidden`是隐藏字段，用于存储不显示在表单界面中的数据。 8. `htmleditor`：`Ext....
`Ext.form.FieldSet` 是 `ExtJS` 框架中的一个组件，它主要用于组织和分组表单中的字段。FieldSet 提供了一种在界面上以可折叠或展开的方式展示一组相关输入字段的方式，有助于增强用户体验和界面的可读性。以下是对...
Ext.form.FieldSet是Ext JS库中的一个组件，用于组织和分组表单字段。它提供了一种方便的方式来呈现和管理一组相关的输入控件，并且可以通过配置项进行自定义以适应不同的设计需求。以下是对FieldSet的一些关键配置...
var setsc = new Ext.form.FieldSet({ title: 'fieldset', // 设置FieldSet的标题 height: 80, // 设置FieldSet的高度 layout: 'form', // 设置FieldSet的布局方式 border: true, // 显示FieldSet的边框 items:...
在`Ext.Window`中添加内容通常通过设置其`items`配置项来完成，可以是任何Ext JS支持的组件，如`Ext.Panel`、`Ext.form.FieldSet`或直接的HTML元素。 插入图片主要涉及以下步骤： 1. **创建图片对象**：在...
**2.21 Field Set (Ext.form.FieldSet)** - **xtype**: `fieldset` - **功能描述**：Field Set 是一个包含一组相关字段的容器。 - **主要用途**：用于将相关的表单字段组织在一起。 **2.22 Hidden (Ext.form....
4.1.19 Ext.form.FieldSet字段集 4.1.20 Ext.form.FieldContainer容器字段 4.1.21 Ext.form.field.File文件上传字段 4.2 实现表单验证 4.2.1 常见的验证类型 4.2.2 表单验证（VType） 4.2.3 自定义VType验证 ...
- `fieldset`：`Ext.form.FieldSet`，用于组织表单字段的组。 - `hidden`：`Ext.form.Hidden`，隐藏字段，不会在表单提交时发送。 - `htmleditor`：`Ext.form.HtmlEditor`，HTML编辑器组件。 - `numberfield`：`...
- `Ext.form.FieldSet`：字段集，用于组织和分组表单元素。 5. **面板及布局** - **面板（Panel）**：作为内容容器，可以包含其他组件。面板支持多种布局方式。 - **布局类**： - `Auto`：自动布局，根据内容...
根据给定的信息，本文将详细解释“Ext 添加功能form表单实例”的知识点，这主要针对Ext初学者。本文会从创建表单、字段定义、验证规则以及提交逻辑等方面进行深入探讨。 ### Ext 添加功能form表单实例 #### 表单...
7. **`fieldset`** - `Ext.form.FieldSet`，表单字段组，用于将一组相关的表单字段组合在一起。 8. **`hidden`** - `Ext.form.Hidden`，表单隐藏域，用于存储需要但不需要显示的信息。 9. **`htmleditor`** - `...
7. **`fieldset`:** 表单字段组组件，用于组织表单字段，通过`Ext.form.FieldSet`类实现。 8. **`hidden`:** 表单隐藏域组件，用于存储不希望用户直接看到的信息，通过`Ext.form.Hidden`类实现。 9. **`htmleditor...
- **`fieldset` (Ext.form.FieldSet)**: 表单字段组组件，用于将相关的表单字段组织在一起。 - **`hidden` (Ext.form.Hidden)**: 表单隐藏域组件，用于在表单中包含隐藏的信息。 - **`htmleditor` (Ext.form....
- **FieldSet**: `Ext.form.FieldSet`，表单字段组。 - **Hidden**: `Ext.form.Hidden`，隐藏字段。 - **HtmlEditor**: `Ext.form.HtmlEditor`，HTML编辑器。 - **NumberField**: `Ext.form.NumberField`，数字...
4. **Ext.form.FieldSet**：如果表单数据复杂，可以使用FieldSet来组织字段，FieldSet是一个可折叠的容器，可以包含多个字段。 5. **Ext.data.Store**：Store是用来存储数据的容器，它可以与表单联动。在动态加载...
本文将深入探讨EXTJS的一些重要属性，包括`Ext.form.TimeField`、`Ext.form.FieldSet`、`Ext.form.DateField`和`Ext.form.ComboBox`。 首先，`Ext.form.TimeField`是EXTJS中的一个时间选择控件，用于让用户选择一个...
多选下拉框在EXT JS中通常通过`Ext.form.CheckboxGroup`或`Ext.form.RadioGroup`类来实现，但在EXT3.2中，实现多选下拉框功能通常会使用`Ext.form.FieldSet`或`Ext.form.ComboBox`的自定义扩展。这类组件提供了复选...
通过`Ext.form.FieldSet`和`Ext.container.Container`等类，开发者可以构建复杂的动态表单结构。 - **动态生成**：开发者可以通过编程方式动态生成表单元素，例如使用`Ext.Component`或`Ext.form.field.Base`的子类...
在ExtJs中，可以使用`Ext.Ajax`或`Ext.form.Basic`配合`Ext.form.FieldSet`和`Ext.form.FileField`实现文件选择和上传。`.net源碼`部分通常会处理这些上传请求，处理文件接收、存储，并返回相应的状态信息。 .NET...