最近在写了一个Ext的程序,就是在Ext的Grid中显示数据,点击一条后,弹出窗口,然后加载数据
具体有两种作法
一、使用Form的load方法
二、使用Ajax请求,得到数据后,赋值给弹出的窗口的Form里
一、弹出窗口后
editWin.form.getForm().load({
url : "../ljzcAction?methodName=query",
params : {
id : _crr.get("id")
},
//waitMsg : '正在载入数据...',
success : function(form,_action){
//alert(editWin.findById("id").value);
myMask.hide();
},
failure : function(form,_action) {
myMask.hide();
Ext.Msg.alert("系统消息", "数据载入出错");
}
});
Form里面需要加入解析JSON数据的reader:
reader:new Ext.data.JsonReader(
{
root:'results'
},
[{name: 'id',mapping:'id'},
{name: 'ljlx',mapping:'ljlx'},
{name: 'ljmc',mapping:'ljmc'},
{name: 'sjklx',mapping:'sjklx'},
{name: 'sjkbbh',mapping:'sjkbbh'},
{name: 'fwm',mapping:'fwm'},
{name: 'url',mapping:'url'},
{name: 'dk',mapping:'dk'},
{name: 'yhm',mapping:'yhm'},
{name: 'mm',mapping:'mm'}
]),
items : [{
fieldLabel : "id",
name : "id",
id : "id",
hideLabel : true,
hidden : true
}, {
fieldLabel : "ljlx",
name : "ljlx",
id : "ljlx",
hideLabel : true,
hidden : true,
value : '数据库型'
}]
二、弹出窗口后,直接请求数据
var editWin = new EditLJZC_SJKWindow();
editWin.show();
var myMask = new Ext.LoadMask(Ext.get('editWin'), {msg:"Please wait..."});
myMask.show();
Ext.Ajax.request({
url : "../ljzcAction?methodName=query",
params : {
id : _crr.get("id")
},
success : function(_action) {
var _obj = Ext.decode(_action.responseText);
var _ljzc = _obj.results[0];
var ljmc = _ljzc["ljmc"];
var sjklx = _ljzc["sjklx"];
var sjkbbh = _ljzc["sjkbbh"];
var fwm = _ljzc["fwm"];
var url = _ljzc["url"];
var dk = _ljzc["dk"];
var yhm = _ljzc["yhm"];
var mm = _ljzc["mm"];
var myForm = editWin.form.getForm();
Ext.getCmp("id").setValue( _crr.get("id")) ;
myForm.findField("ljlx").setValue(_crr.get("ljlx"));
myForm.findField("ljmc").setValue(ljmc);
myForm.findField("sjklx").setValue( sjklx);
myForm.findField("sjkbbh").setValue( sjkbbh);
editWin.findById("fwm").setValue(fwm);
editWin.findById("url").setValue(url);
editWin.findById("dk").setValue(dk);
//editWin.findById("yhm").value = yhm;
editWin.findById("yhm").setValue(yhm);
Ext.getCmp("mm").setValue(mm) ; //起作用
alert(editWin.findById("id").value);
editWin.show();
myMask.hide();
},
failure : function(_action) {
var _obj = Ext.decode(_action.responseText);
Ext.Msg.alert("系统消息", _obj["message"]);
myMask.hide();
}
});
这里,我最开始出现了一个问题,就是直接赋值 editWin.findById("yhm").value = yhm,结果窗口老是没有变化,
只有调用系统的方法才管用
分享到:
相关推荐
根据给定的信息,本文将详细解释“Ext 添加功能form表单实例”的知识点,这主要针对Ext初学者。本文会从创建表单、字段定义、验证规则以及提交逻辑等方面进行深入探讨。 ### Ext 添加功能form表单实例 #### 表单...
在Ext JS这个强大的JavaScript框架中,动态加载表单数据是一种常见的功能需求,特别是在构建数据驱动的应用程序时。本文将深入探讨如何使用JSON格式的数据来实现这一功能,以便于灵活地更新和显示表单内容。 首先,...
FormPanel提供了数据提交、验证、加载和保存的功能。 2. **表单字段(Form Fields)**:包括文本字段(TextField)、密码字段(PasswordField)、选择框(Checkbox)、复选框组(CheckboxGroup)、单选框...
- 扩展Vtype:开发者可以通过`Ext.form.field.VTypes.add`方法来添加新的验证类型,比如自定义电话号码验证或身份证号验证。 - 示例:`Ext.form.field.VTypes.add('phone', /^\d{11}$/);`,这将添加一个新验证类型...
在Ext JS中,`Ext.form_load`涉及到的主要知识点是FormPanel的数据加载机制,这包括了对FormPanel的form对象、BasicForm、doAction方法、Ext.form.Action对象以及JsonReader的使用。以下是对这些概念的详细解释: 1...
2. **配置项**:`Ext.form.TextField`支持多种配置项来定制其行为和外观,如`fieldLabel`(字段标签)、`name`(字段名,用于数据绑定)、`width`(宽度)、`maxLength`(最大字符数)等。 3. **验证**:EXT提供了...
在"EXT制作的FORM,可以与Servlet进行交互"这一主题中,我们要讨论的是如何利用EXT form来与服务器端的Servlet进行数据交换。Servlet是一种Java技术,用于扩展Web服务器的功能,处理HTTP请求并返回响应。在EXT form...
数据存储具有加载、刷新、添加、删除和更新数据的能力,并且能够监听数据变化,实时同步UI。此外,Store与Grid、Tree等组件紧密配合,实现数据的展示和交互。 在数据传输过程中,Ext JS提供了Ajax请求(Ext.Ajax)...
例如,`form.load()`用于加载表单数据,`form.submit()`用于提交表单,`field.setValue()`用于设置字段值,`field.validate()`用于执行字段验证。 五、Demo分析 在"demo"这个压缩包中,可能包含了EXT 2.0表单示例...
Ext Form 是 Ext JS 库中的一个关键组件,用于创建丰富的、交互式的网页表单。它在Web应用程序中扮演着至关重要的角色,允许用户输入、编辑和提交数据。本示例旨在展示如何使用 Ext Form 来构建基本的表单结构以及与...
Leangle.form.combo.ColorComboBox = Ext.extend(Leangle.form.BaseComboBox, { // ComboBox configurations store: new Ext.data.JsonStore({ // store configurations }) }); ``` 在这种情况下,尝试使用`Ext...
在Ext JS中,异步加载是一种常见的数据处理方式,尤其在构建动态的用户界面时非常有用。本篇文章主要探讨了如何在异步加载的场景下,实现树形控件(TreePanel)中节点的动态添加、删除以及ComboBox选择项的修改。 ...
4. **数据存储(Store)**:`Ext.data.Store`是连接数据模型和视图的关键,它负责管理数据加载、更新和同步。在这个例子中,数据库配置可能直接在Store的配置项中定义,通过URL或内存中的数据进行数据交互。 5. **...
接着使用EXT提供的API来初始化TabPanel组件,并添加相应的标签页。 **Step3: 创建Tab控制逻辑** 最后编写逻辑代码来控制TabPage的切换行为。 #### 表单组件入门 EXT提供了丰富的表单组件,可以帮助开发者轻松地...
在Ext JS框架中,`Ext.form.TextField`是一种用于收集用户输入的基本控件,它提供了丰富的配置选项来实现数据校验。例如,在示例中,通过设置`allowBlank: false`,确保了字段不允许为空;`emptyText`定义了当字段为...
### ext控件Form相关配置详解 #### 一、引言 在现代Web开发中,Ext JS作为一款功能强大且灵活的前端框架,被广泛应用于构建复杂的企业级应用程序。其中,`Form`控件是Ext JS中一个非常重要的组成部分,它为开发者...
在EXT2中,Form表单是数据输入和用户交互的核心部分。它们允许用户填写和提交信息,通常用于创建动态和复杂的Web表单。EXT2的form表单支持各种字段类型,如文本框、复选框、单选按钮以及我们在此处重点关注的...
EXT Form还允许动态地添加、删除或修改表单字段,使得交互性更强。例如,`ext_formhUФ.doc`可能包含关于如何创建、布局、验证和提交EXT Form的具体步骤和示例代码。 二、EXT Grid EXT Grid是一种灵活的数据显示...
使用`Ext.form.Basic`和`Ext.form.Panel`,可以轻松实现数据的提交和验证。 2. **EXT4.3动态grid**: - **动态列**:EXT4.3的`Ext.grid.Panel`允许在运行时动态添加、删除和调整列宽。开发者可以通过`columns`配置...
3. 在左侧列中添加一个Grid Panel(数据列表),使用Store加载和展示数据。 4. 在右侧列中使用Form Panel来创建表单。Form Panel可以包含多个FieldSet,每个FieldSet代表表单的一个部分。 5. 配置Form Panel的layout...