Ext.form.TextField主要配置表:
allowBlank Boolean 是否允许为空(默认true)
blankText String 为空验证失败提示信息
emptyText String 空字段中默认显示信息
grow Boolean 设置字段是否根据内容伸缩(默认false)
growMax Number 字段伸展的最大宽度(默认800)
growMin Number 字段收缩最小宽度(默认30)
inputType String 字段类型(默认text)
maxLength Number 字段允许输入最大长度
masLengthText String 最大长度验证失败提示信息
minLength Number 字段允许输入最小长度
minLenghtText String 最小长度验证失败提示信息
regex String javascript正则表达式
regexText String 正则表达式验证失败提示信息
selectOnFocus Boolean 设置当前字段得到焦点是否自动选择已存在文本(默认false)
vtype String 验证类型名字
vtypeText String 自定义提示信息,代替vtype本身的错误提示信息
validator Function 在所有基本验证通过后调用(默认null)
Ext.onReady(function(){
Ext.BLANK_IMAGE_URL = '../extjs2.0/resources/images/default/s.gif';
//初始化信息提示功能
Ext.QuickTips.init();
//统一指定错误信息提示浮动显示方式
Ext.form.Field.prototype.msgTarget = 'side';
var config = {
title:'Ext.form.TextField例', //表单标题
labelSeparator:':', //表单label与其他元素分割符
labelWidth:60, //标签宽
labelAlign:'right', //标签对齐方式
bodyStyle:'padding:5 5 5 5', //表单边距
frame:true, //是否渲染表单
height:120, //表单高
width:250, //表单宽
renderTo:'form', //表单定位
//表单子元素数组
items:[
new Ext.form.TextField({
fieldLabel:'用户名',
id:'userName',
selectOnFocus:true, //得到焦点自动选择文本
allowBlank:false, //不允许为空
blankText:'用户名不可为空', //空验证失败错误提示信息
//javascript邮件验证正则表达式
regex:/^([\w]+)(.[\w]+)*@([\w-]+\.){1,5}([A-Za-z]){2,4}$/,
regexText:'用户格式错误' //javascript正则表达式验证失败错误信息提示
}),
new Ext.form.TextField({
fieldLabel:'密码',
inputType:'password', //设置输入类型为password
allowBlank:false,
blankText:'密码不可为空'
})
]
}
var form = new Ext.form.FormPanel(config);
});
分享到:
相关推荐
`Ext.form.TextField`是EXT框架中的一个核心组件,用于创建基本的输入字段,如文本输入框。这个组件提供了多种功能,包括但不限于: 1. **基本用法**:最简单的使用方式是在表单(`Ext.form.Panel`)中创建一个`Ext...
12. `textfield`:`Ext.form.TextField`是最基本的文本输入框,用于接收用户输入的一行文本。 13. `timefield`:`Ext.form.TimeField`允许用户选择时间,通常与日期字段一起使用,创建日期和时间选择器。 14. `...
- `textfield`:`Ext.form.TextField`,单行文本输入框。 - `trigger`:`Ext.form.TriggerField`,触发式输入框,常用于日期或搜索框。 - `checkboxgroup`:`Ext.form.CheckboxGroup`,自2.2版本起,用于组织多个...
- **概述**:`Ext` 是 ExtJS 的核心命名空间,包含了全局的方法和属性。 - **用途**:提供了一个统一的入口来访问 ExtJS 库的功能,如创建组件、管理事件等。 - **常用方法**: - `Ext.create()`: 创建一个组件实例...
在提供的压缩包中,"ext-3-TextField-sample.rar" 涉及到的是ExtJS 3.x版本中的TextField组件,这是一个基本的用户输入控件,常用于收集用户在网页上的文本信息。这个示例着重介绍了如何创建和使用TextField。 ...
Ext.form.TextField是Ext JS中的一个核心组件,它允许用户在表单中输入单行文本。这个组件可以用于创建各种类型的输入字段,如普通文本输入、密码输入、电子邮件地址输入等,通过设置不同的配置选项来满足不同的需求...
在登录页面中,我们会用到`Ext.form.field.Text`(文本输入框)和`Ext.button.Button`(按钮)。 2. **Ext.container.Container**: 用于组合其他组件,如`Ext.container.Viewport`可以作为整个应用的容器,包含登录...
- **示例**: `new Ext.form.TextField({ labelWidth: 100, labelAlign: 'right', allowBlank: false, listeners: { afterrender: function(field) { field.el.on('mouseover', function(e) { var tip = new Ext....
7. **使用示例**:在应用中引入这个扩展,然后像使用普通的Textfield一样使用`Ext.form.field.MoneyField`,但会自动获得金额输入的特性。 通过这个扩展,开发者可以简化金额输入的处理,提高用户体验,同时也保证...
"ext输入框点击回车键直接进入查询"这一主题涉及到的是EXTJS框架中的一个常见功能,即如何在用户在输入框中按下回车键时触发查询操作。EXTJS是一个强大的JavaScript库,用于构建桌面和移动应用,它提供了丰富的组件...
this.search_textfield = new Ext.form.TextField({ width: '98%', enableKeyEvents: true }); this.search_btn = new Ext.Button({ text: '', width: 70 }); this.search_high = new Ext.Button({ text: '高级',...
var form = new Ext.form.FormPanel({ renderTo: 'div', labelAlign: 'right', buttonAlign: 'right', labelWidth: 60, title: '表单', frame: true, width: 400, items: [{ layout: 'column', items: [ ...
`Ext.form.TextField` 是一个文本输入框字段。 - **属性:** - `allowBlank`: 是否允许空白,默认为 `true`。 - `blankText`: 空白时的错误提示。 - `emptyText`: 占位符文本。 - `grow`: 是否自动伸展,默认为...
'viewport > form textfield[name=password]': { keypress: this.userLogin } }) }, userLogin: function(b, e, eOpts) { if (e.getKey() == 13) { // 检查是否按下了回车键 Ext.Msg.alert('提示', '您已经...
在这个例子中,`columns`数组包含了多个对象,每个对象代表一列,其中`editor`属性指定了该列的编辑器,如`TextField`(文本框)、`ComboBox`(下拉框)和`NumberField`(数字输入框)。 - `TextField`允许用户...
UnitText.js ======================= 代码如下: // 输入框textfield后面放字unitText定义: Ext.override(Ext.form.TextField, { unitText : ”, onRender : function(ct, position) { Ext.form.TextField....
### 使用Ext进行登录功能开发详解 #### 一、前言 在现代Web应用开发中,登录功能是非常基础且重要的组成部分。对于初学者来说,如何利用Ext框架实现一个完整的登录功能可能会遇到不少挑战。本文将通过一份示例代码...
EXTJS允许我们通过其丰富的组件库创建美观且功能丰富的表单,包括输入框、按钮等元素。在登录场景中,我们通常会有一个包含用户名和密码字段的表单,并且需要进行服务器端的验证来确保用户信息的正确性。下面我们将...
这可能包括文本输入框(`Ext.form.TextField`)用于用户名和留言内容,下拉菜单(`Ext.form.ComboBox`)用于选择主题,以及提交按钮(`Ext.Button`)来发送留言。 2. **布局管理**:EXT的布局系统允许开发者灵活地...