直接上代码: 代码 写道
Ext.onReady(function() {
var form = new Ext.form.FormPanel({
baseCls: 'x-plain',
labelWidth: 55,
url:'save-form.php',
defaultType: 'textfield',
items: [{
fieldLabel: 'Send To',
name: 'to',
anchor:'100%' // anchor width by percentage
},{
fieldLabel: 'Subject',
name: 'subject',
anchor: '100%' // anchor width by percentage
}, {
xtype: 'textarea',
hideLabel: true,
name: 'msg',
anchor: '100% -53' // anchor width by percentage and height by raw adjustment
}]
});
var window = new Ext.Window({
title: 'Resize Me',
width: 500,
height:300,
minWidth: 300,
minHeight: 200,
layout: 'fit',
plain:true,
bodyStyle:'padding:5px;',
buttonAlign:'center',
items: form,
buttons: [{
text: 'Send'
},{
text: 'Cancel'
}]
});
window.show();
});[/code]
分享到:
相关推荐
1. **控件使用**:展示了如何在ASPX页面中嵌入和配置Ext.NET控件,如使用GridPanel展示数据,使用FormPanel处理表单提交等。 2. **数据绑定**:可能会涉及到如何将后端数据源(如数据库)与Ext.NET控件绑定,实现...
- **示例**: 使用 `Ext.Fx` 和 `Ext.Element` 类中的动画函数实现动态效果。 #### 五、元素操作与模板 **5.1 元素操作** - **工具**: `Ext.DomHelper` 类提供了创建、操作 DOM 元素的方法。 - **示例**: `Ext....
- **`Class`**: `Ext.FormPanel/Ext.form.FormPanel` - **描述**: 表单面板,用于组织表单字段。 2. **`checkbox`:** - **`xtype`**: `checkbox` - **`Class`**: `Ext.form.Checkbox` - **描述**: 复选框组件...
- **`form` (Ext.FormPanel/Ext.form.FormPanel)**: 表单面板组件,用于创建包含多个表单元素的表单。 - **`checkbox` (Ext.form.Checkbox)**: 多选框组件,用于实现多选功能。 - **`combo` (Ext.form.ComboBox)**: ...
#### 二、开始ExtJS 1. **获得ExtJS**: - 通过官方网站或第三方资源下载最新版本的ExtJS库。 - 常见的获取途径包括GitHub仓库、NPM包管理器或CDN服务。 2. **应用ExtJS**: - 将下载的文件添加到项目中,确保...
通过`items`属性,可以将多个组件嵌入到一个Panel中。 3. **Ext.grid.GridPanel**: Grid是EXTJS处理表格数据的主要组件,支持分页、排序、过滤等功能。GridPanel包括`store`(数据源)、`columns`(列定义)和`...
9. **`flash`:** Flash组件,用于在页面中嵌入Flash内容,自3.0版本开始支持,通过`Ext.FlashComponent`类实现。 10. **`grid`:** 表格组件,用于展示和编辑表格数据,通过`Ext.grid.GridPanel`类实现。 11. **`...
最后,表单被嵌入到一个窗口`Ext.Window`中,窗口有自定义的宽度、高度、位置以及是否可最大化和调整大小等属性。 总结来说,此代码段展示了EXTJS中如何创建一个具有交互性的表单,包括下拉列表的使用、事件监听、...
代码中使用了ExtJs的组件,如Panel、FormPanel、Window等。Panel组件用于显示界面的基本结构,FormPanel则用于实现表单的输入部分,Window组件用于创建一个浮层窗口。 代码解析如下: 1. 首先,通过`Ext.QuickTips...