在ExtJs中不能直接通过fieldLabel='new fieldLabel'来修改Form中组件的fieldLabel.不过可以通过修改dom来完成对fieldLabel的修改。
下面我做了个简单的示例：
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<link rel="stylesheet" type="text/css" href="../ext-2.2.0/resources/css/ext-all.css" />
<link href="column-tree.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="../ext-2.2.0/adapter/ext/ext-base.js"></script>
<script type ="text/javascript" scr="../ext-2.2.0/ext-all-debug.js></script>
<script type="text/javascript" src="../ext-2.2.0/ext-all.js"></script>
<script language="javascript">
Ext.onReady(function(){
var formpanel =new Ext.form.FormPanel({
title:'ChangeFieldLabel',
applyTo:'script',
frame:true,
height:'400',
width:'600',
autoShow:true,
buttons:[{text:'changFieldLabel',handler:function changeFieldLabel(){
//获取fieldLabel对象
label =Ext.getCmp('changeLabel').getEl().parent().parent().first();
//修改fieldLabel
label.dom.innerHTML ='afterChange';
}}],
labelAlign:'right',
items:[{ xtype:'textfield',
id:'changeLabel',
fieldLabel:'beforeChange'
}]
});
});
</script>
<body>
<div id="script" >
</div>
</body>
</head>
</html>
上在这个例子中，在firebug下html如下图.
说明：由上图可以看出代码中parent()的个数由form组件位置决定的。
- 大小: 5.5 KB
分享到：
相关推荐
### extjs-form组件配置参数详解 #### 一、Ext.form.Action `Ext.form.Action`是ExtJS中的一个类，用于处理表单提交和加载数据的动作。它提供了多种配置选项和属性来控制表单操作的过程。 **配置项** - **success*...
fieldLabel: '日期' }], renderTo: Ext.getBody() }); ``` 以上就是如何在ExtJs中创建一个带有清空功能的日期组件的基本过程。通过自定义组件并扩展基础功能，我们不仅满足了项目需求，还增强了用户体验。这个...
在本示例中，"EXT dojochina文本框示例Ext.form.TextField.rar"是一个压缩包，包含了EXT框架中关于`Ext.form.TextField`组件的示例代码。 `Ext.form.TextField`是EXT框架中的一个核心组件，用于创建基本的输入字段...
Ext.ux.form.TinyMCETextArea 是一个在Extjs4框架下实现的组件，它将TinyMCE编辑器集成到了ExtJS的表单控件中，提供了富文本编辑的功能。这个组件是基于HTML5构建的，因此在兼容性和功能上能够满足现代网页应用的...
它提供了一整套组件化的用户界面元素，包括表单（Form）、网格（Grid）、树形视图（Tree）等，使得开发者能够创建出功能丰富且交互性强的前端应用。在深入探讨ExtJS 4的基础知识之前，首先确保你已经下载了ExtJS ...
EXT框架（通常指的是Ext JS）作为一种成熟且功能丰富的JavaScript库，提供了强大的UI组件和便捷的数据处理方法，其中就包括了异步提交FORM表单的功能。 #### 二、EXT异步提交FORM表单的基本原理与实现 ##### 2.1 ...
{ columnWidth: .33, layout: 'form', items: [{ xtype: 'textfield', fieldLabel: '姓名' }, { xtype: 'textfield', fieldLabel: '地址' }] }, { columnWidth: .33, layout: 'form', defaultType: 'textfield', ...
有时，我们可能需要根据应用需求在运行时禁用这些组件的编辑功能，例如，展示只读信息或者保护数据不被非法修改。本文将详细探讨如何在Ext JS中实现禁止文本字段和日期选择器的编辑。 首先，让我们来看一下`...
它提供了一系列组件化的UI元素，包括我们这里提到的FORM，用于用户输入和数据交互。EXT form是EXT框架中的一个关键部分，允许开发者创建复杂的表单结构，同时提供了丰富的功能和高度的定制性。 在"EXT制作的FORM，...
EXTJS 的上传组件通常通过`Ext.form.field.File`（也称为FileField或UploadField）实现。这个组件提供了一个表单字段，用户可以通过点击“浏览”按钮选择本地文件，然后提交表单进行上传。以下是一些关于EXTJS上传...
Ext.form.TextField是Ext JS中的一个核心组件，它允许用户在表单中输入单行文本。这个组件可以用于创建各种类型的输入字段，如普通文本输入、密码输入、电子邮件地址输入等，通过设置不同的配置选项来满足不同的需求...
var myFormPanel = new Ext.form.FormPanel({ width: 300, bodyStyle: 'padding:10px', items: [{ xtype: 'label', id: 'factorName', fieldLabel: '要素名称', // 使用html属性插入HTML内容 ...
var password = this.up('form').down('[name=password]').getValue(); return value == password; } } ``` ### 手机号码输入框 对于需要输入手机号码的场景，可以利用正则表达式来限制输入格式。例如： ```...
Ext2.0 Form 使用实例详解 在Web应用开发中，ExtJS库提供了强大的用户界面组件，其中FormPanel是用于创建复杂表单的重要组件。本文将详细介绍Ext2.0 FormPanel的使用，包括创建方法、控件配置以及布局管理。 首先...
它提供了一整套组件和工具，包括用于处理用户输入的form表单。当我们需要在表单中加载复杂的JSON数据时，ExtJS提供了丰富的功能来实现这一需求。 首先，让我们了解什么是JSON（JavaScript Object Notation）。JSON...
EXTJS是一种基于JavaScript的前端框架，它提供了丰富的用户界面组件，包括用于文件上传的组件。在EXTJS中，实现批量上传文件是一项常见的需求，尤其在处理大量数据或媒体文件时。EXTJS的文件上传组件提供了方便的...
本示例探讨如何利用Ext JS中的`Ext.form.field.ComboBox`组件，结合Java后端和JSON数据格式，来创建这样一个功能。 `Ext.form.field.ComboBox`是Ext JS框架中一个强大的组件，它提供了下拉列表的功能，可以用于创建...
Ext Form 是 Ext JS 库中的一个关键组件，用于创建丰富的、交互式的网页表单。它在Web应用程序中扮演着至关重要的角色，允许用户输入、编辑和提交数据。本示例旨在展示如何使用 Ext Form 来构建基本的表单结构以及与...
fieldLabel: '姓名', name: 'name' }); ``` 3. **动态添加字段到表单**： 使用`add`方法将字段添加到表单容器中： ```javascript formPanel.add(textField); formPanel.doLayout(); // 重新布局以显示新...