在FormPanel没有配置url和reader时,也可以通过FormPanel.form.load()方法添加url来直接加载数据,但此时需要server端返回的数据遵循一定的格式.
var url = Listener + '?className=etl.db.VariableManage&thodName=getVariableJSONById¶mCount=1¶m_0='+ variable_id;
formPanel.form.load({
waitTitle : "请稍候",
waitMsg : "正在加载表单数据,请稍候......",
url : url,
success : function(form, action) {
},
failure : function(form, action) {
Ext.MessageBox.alert('加载失败', action.result.errors);
}
});
server端需要返回的字符串格式:
"{success:true,data:{ variableName:'',variableCategory:'',variableCode:'',variableMeaning:''}}"
或者用双引号:
"{success:true,data:{ variableName:\"\",variableCategory:\"\",variableCode:\"\",variableMeaning:\"\"}}"
相应的组件会自动被赋值。所谓相应的组件,指name属性为json串里字段的组件。比如:
var variableName = new Ext.form.TextField({
xtype : 'textfield',
name : 'variableName',
fieldLabel : '名称',
emptyText : '请输入',
allowBlank : false,
anchor : '90%',
selectOnFocus : true
});
如果不指明name属性的话,只声明var variableName是找不到组件的
分享到:
相关推荐
在Ext JS中,`Ext.form_load`涉及到的主要知识点是FormPanel的数据加载机制,这包括了对FormPanel的form对象、BasicForm、doAction方法、Ext.form.Action对象以及JsonReader的使用。以下是对这些概念的详细解释: 1...
在Ext JS这个强大的JavaScript框架中,动态加载表单数据是一种常见的功能需求,特别是在构建数据驱动的应用程序时。本文将深入探讨如何使用JSON格式的数据来实现这一功能,以便于灵活地更新和显示表单内容。 首先,...
var formPanel = new Ext.form.FormPanel({ items: [multiSelectComboBox], renderTo: Ext.getBody() }); ``` 在上述代码中,我们创建了一个JSON数据存储,并将其与ComboBox关联。设置`multiSelect: true`后,...
通过`bind`方法或`form.loadRecord`方法可以加载和保存数据。 7. **表单验证**: 表单验证是确保用户输入符合预设规则的关键部分。ExtJS提供内置的验证功能,可以在字段级别或表单级别设置验证规则。 在这个案例...
Form组件,即`Ext.form.FormPanel`,用于创建和管理表单数据。它可以包含各种输入控件,如文本字段、复选框、下拉列表等。表单数据可以方便地提交到服务器,或者与数据存储进行双向绑定。下面是一个创建简单表单的...
当formpanel的数据源与一个`Ext.data.Model`实例(通常来自`Ext.grid.Panel`的行数据)相同,我们可以直接利用`Form.getForm().loadRecord(record)`方法来加载数据。这个方法会将模型对象`record`中的数据映射到表单...
ExtJs 4.0的FormPanel对象提供了`getForm()`方法获取表单实例,然后通过`form.submit()`或`form.serialize()`方法完成数据的序列化。 4. **表单提交过程** - **创建表单组件**:首先,定义一个FormPanel,并在其...
- **FormPanel**: `Ext.FormPanel`,表单容器。 - **Checkbox**: `Ext.form.Checkbox`,复选框。 - **ComboBox**: `Ext.form.ComboBox`,下拉选择框。 - **DateField**: `Ext.form.DateField`,日期输入框。 - ...
- **Ext.form.FormPanel**: 创建表单的容器,支持多种表单元素和验证。 - **Ext.form.Field**: 表单字段类,如文本框、选择框、日期选择器等。 - **Ext.form.BasicForm**: 提供表单的提交和数据验证功能。 7. **...
var treeCombo = Ext.create('Ext.form.field.Tree', { fieldLabel: '选择节点', displayField: 'text', valueField: 'id', store: treeStore, queryMode: 'local' }); var formPanel = Ext.create('Ext....
提交 `Ext.form.FormPanel` 表单可以通过调用 `form.submit()` 方法来实现。该方法接受一个配置对象,其中可以指定服务器端的 URL、提交成功或失败后的回调函数等。 ```javascript formPanel.getForm().submit({ ...
`Ext.form.FormPanel`是Ext框架中用于处理表单的主要组件之一,它提供了一系列的方法来管理和提交表单数据。 - **submit方法**:`FormPanel.getForm().submit()`方法用于提交当前表单。该方法支持传递一些参数,如`...
`Ext.form.Action` 是用于处理表单操作的类,主要包括提交和加载数据的功能。 - **属性:** - `success`: 表示操作成功时的回调函数。 - `failure`: 表示操作失败时的回调函数。 - `method`: 请求方式,默认为 `...
2. 数据绑定:EXT 2.0支持数据绑定,使得视图与模型之间的同步变得简单,这对于表单验证和数据管理至关重要。 3. 动态布局:EXT 2.0的布局管理器提供了多种布局方式,如表格布局、流式布局、绝对布局等,方便开发者...
在Extjs4中,可以使用`form.load()`方法将JSON数据加载到FormPanel中。这个方法接收一个配置对象作为参数,该对象通常包括URL、请求类型(GET或POST)、成功回调函数和失败回调函数等属性。当后端服务器返回JSON数据...
2. **Ext.FormPanel**: 表单面板组件,用于组织和管理表单控件。 3. **Ext.MessageBox**: 模态对话框组件,用于显示消息、警告或确认对话框。 4. **Ext.form.Field**: 基础的表单字段组件,提供了表单验证和数据绑定...
FormPanel提供了数据提交、验证、加载和保存的功能。 2. **表单字段(Form Fields)**:包括文本字段(TextField)、密码字段(PasswordField)、选择框(Checkbox)、复选框组(CheckboxGroup)、单选框...
6.3.4 在form中使用Ext.Direct加载数据 185 6.3.5 在form中使用Ext.Direct提交数据 187 6.3.6 使用polling方式进行轮询 189 6.4 本章小结 191 第7章 Store 192 7.1 Store的结构 192 7.2 Ext.data.Field 197 7.3 Ext....
EXT 中的表单组件(`Ext.form.FormPanel`)在数据交互中起着关键作用。例如,`createForm()` 方法创建了一个包含输入字段的表单面板,允许用户输入或编辑数据。表单的提交是通过 `form.submit()` 实现的,它支持异步...