`
ghl116
  • 浏览: 163877 次
  • 性别: Icon_minigender_1
  • 来自: 上海
社区版块
存档分类
最新评论

Ext form加载数据

阅读更多

最近在写了一个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 添加功能form表单实例”的知识点,这主要针对Ext初学者。本文会从创建表单、字段定义、验证规则以及提交逻辑等方面进行深入探讨。 ### Ext 添加功能form表单实例 #### 表单...

    Ext 动态加载表单数据

    在Ext JS这个强大的JavaScript框架中,动态加载表单数据是一种常见的功能需求,特别是在构建数据驱动的应用程序时。本文将深入探讨如何使用JSON格式的数据来实现这一功能,以便于灵活地更新和显示表单内容。 首先,...

    Ext2.0 form使用实例的例程

    FormPanel提供了数据提交、验证、加载和保存的功能。 2. **表单字段(Form Fields)**:包括文本字段(TextField)、密码字段(PasswordField)、选择框(Checkbox)、复选框组(CheckboxGroup)、单选框...

    ext form小例子

    - 扩展Vtype:开发者可以通过`Ext.form.field.VTypes.add`方法来添加新的验证类型,比如自定义电话号码验证或身份证号验证。 - 示例:`Ext.form.field.VTypes.add('phone', /^\d{11}$/);`,这将添加一个新验证类型...

    Ext form_load

    在Ext JS中,`Ext.form_load`涉及到的主要知识点是FormPanel的数据加载机制,这包括了对FormPanel的form对象、BasicForm、doAction方法、Ext.form.Action对象以及JsonReader的使用。以下是对这些概念的详细解释: 1...

    EXT dojochina文本框示例Ext.form.TextField.rar

    2. **配置项**:`Ext.form.TextField`支持多种配置项来定制其行为和外观,如`fieldLabel`(字段标签)、`name`(字段名,用于数据绑定)、`width`(宽度)、`maxLength`(最大字符数)等。 3. **验证**:EXT提供了...

    EXT制作的FORM,可以与Servlet进行交互

    在"EXT制作的FORM,可以与Servlet进行交互"这一主题中,我们要讨论的是如何利用EXT form来与服务器端的Servlet进行数据交换。Servlet是一种Java技术,用于扩展Web服务器的功能,处理HTTP请求并返回响应。在EXT form...

    深入浅出Ext_JS:数据存储与传输

    数据存储具有加载、刷新、添加、删除和更新数据的能力,并且能够监听数据变化,实时同步UI。此外,Store与Grid、Tree等组件紧密配合,实现数据的展示和交互。 在数据传输过程中,Ext JS提供了Ajax请求(Ext.Ajax)...

    ext 2.0 form demo

    例如,`form.load()`用于加载表单数据,`form.submit()`用于提交表单,`field.setValue()`用于设置字段值,`field.validate()`用于执行字段验证。 五、Demo分析 在"demo"这个压缩包中,可能包含了EXT 2.0表单示例...

    Ext Form 示例

    Ext Form 是 Ext JS 库中的一个关键组件,用于创建丰富的、交互式的网页表单。它在Web应用程序中扮演着至关重要的角色,允许用户输入、编辑和提交数据。本示例旨在展示如何使用 Ext Form 来构建基本的表单结构以及与...

    Ext.Store的获取方法

    Leangle.form.combo.ColorComboBox = Ext.extend(Leangle.form.BaseComboBox, { // ComboBox configurations store: new Ext.data.JsonStore({ // store configurations }) }); ``` 在这种情况下,尝试使用`Ext...

    Ext 异步加载添加 删除节点 修改combobox选择项

    在Ext JS中,异步加载是一种常见的数据处理方式,尤其在构建动态的用户界面时非常有用。本篇文章主要探讨了如何在异步加载的场景下,实现树形控件(TreePanel)中节点的动态添加、删除以及ComboBox选择项的修改。 ...

    ext实例 左边是 tree 右边是grid 双击grid弹出form修改

    4. **数据存储(Store)**:`Ext.data.Store`是连接数据模型和视图的关键,它负责管理数据加载、更新和同步。在这个例子中,数据库配置可能直接在Store的配置项中定义,通过URL或内存中的数据进行数据交互。 5. **...

    EXT中文手册 Grid Form

    接着使用EXT提供的API来初始化TabPanel组件,并添加相应的标签页。 **Step3: 创建Tab控制逻辑** 最后编写逻辑代码来控制TabPage的切换行为。 #### 表单组件入门 EXT提供了丰富的表单组件,可以帮助开发者轻松地...

    ext_表单提交_数据校验

    在Ext JS框架中,`Ext.form.TextField`是一种用于收集用户输入的基本控件,它提供了丰富的配置选项来实现数据校验。例如,在示例中,通过设置`allowBlank: false`,确保了字段不允许为空;`emptyText`定义了当字段为...

    ext控件form相关配置

    ### ext控件Form相关配置详解 #### 一、引言 在现代Web开发中,Ext JS作为一款功能强大且灵活的前端框架,被广泛应用于构建复杂的企业级应用程序。其中,`Form`控件是Ext JS中一个非常重要的组成部分,它为开发者...

    EXT2_combobox_form.rar_combobox ext_ext

    在EXT2中,Form表单是数据输入和用户交互的核心部分。它们允许用户填写和提交信息,通常用于创建动态和复杂的Web表单。EXT2的form表单支持各种字段类型,如文本框、复选框、单选按钮以及我们在此处重点关注的...

    ext文档 和实例

    EXT Form还允许动态地添加、删除或修改表单字段,使得交互性更强。例如,`ext_formhUФ.doc`可能包含关于如何创建、布局、验证和提交EXT Form的具体步骤和示例代码。 二、EXT Grid EXT Grid是一种灵活的数据显示...

    EXT4.3实现动态表单全动态

    使用`Ext.form.Basic`和`Ext.form.Panel`,可以轻松实现数据的提交和验证。 2. **EXT4.3动态grid**: - **动态列**:EXT4.3的`Ext.grid.Panel`允许在运行时动态添加、删除和调整列宽。开发者可以通过`columns`配置...

    Ext Column+Form布局画复杂页面

    3. 在左侧列中添加一个Grid Panel(数据列表),使用Store加载和展示数据。 4. 在右侧列中使用Form Panel来创建表单。Form Panel可以包含多个FieldSet,每个FieldSet代表表单的一个部分。 5. 配置Form Panel的layout...

Global site tag (gtag.js) - Google Analytics