修改EXT的TextField的验证属性(allowBlank和maxLength)的提示信息.
TextField本身验证长度时把中文当1位来计算的,这样针对像oracle数据库的varchar2(10)这种数据类型在前台作长度限制时就不太好控制.EXT也没相关的可以设置的属性,当然可以用TextField的表达式验证来判断.我喜欢偷懒,所以直接重写TextField,顺便把blankText和maxLengthText属性默认成TextField的FieldLabel+提示信息.
/**
* @class Ext.form.TextField
* @override Ext.form.TextField
* @description 修改TextField的默认提示信息,并支持中文2位的计算
*/
Ext.override(Ext.form.TextField,{
//重写验证涵数
validateValue : function(value){
if(this.allowBlank == false){ //不允许为空
if(value == null || value == ''){
this.markInvalid(String.format(this.blankText,value));
return false;
}
}
var maxLen = this.maxLength;
var maxLenText = this.maxLengthText;
if(maxLenText.indexOf('{0}') != -1){
if(maxLen != null && maxLen != 'undefined' && maxLen > 0){
var regex = /[^\x00-\xff]/g; //中文正则
var len ;
if(value instaceof String){
//将中文替换成2位字符
len = value.replace(regex,'**').length;
}else{
len = value.length;
}
var label = this.fieldLabel;
if(label != null && label != 'undefined'){
//去掉fieldLabel中生成的不必要字符
if(label.indexOf('</') != -1 ){
label = label.substring(label.lastIndexOf('>')+1, label.length);
}
if(len > maxLen){
//验证未通过,并设置提示信息
this.markInvalid(String.format(label+'长度不能大于'+maxLen+'位!(中文占2位)'));
return false;
}
return true;
}
}
}else{
var len = value.length;
if(len > maxLen){
this.markInvalid(String.format(maxLenText ,value));
return false;
}
return true;
}
}
});
分享到:
相关推荐
在提供的压缩包中,"ext-3-TextField-sample.rar" 涉及到的是ExtJS 3.x版本中的TextField组件,这是一个基本的用户输入控件,常用于收集用户在网页上的文本信息。这个示例着重介绍了如何创建和使用TextField。 ...
在Web开发领域,Ext JS是一个强大的JavaScript库,用于构建数据驱动的富客户端应用程序。它提供了丰富的用户界面组件,包括各种表单元素。本篇我们主要关注"Ext表单组件之textField",它是最基础也是最常用的输入...
EXT中的TextField支持多种vtype验证类型,这些类型提供了基础的数据验证功能,帮助开发者构建健壮的前端表单。以下是一些常见的EXT TextField vtype验证类型及其详解: 1. **email**:验证输入是否为有效的电子邮件...
2. **配置项**:`Ext.form.TextField`支持多种配置项来定制其行为和外观,如`fieldLabel`(字段标签)、`name`(字段名,用于数据绑定)、`width`(宽度)、`maxLength`(最大字符数)等。 3. **验证**:EXT提供了...
在给定的描述中,我们看到开发者遇到了一个问题:默认情况下,ExtJs5的`textfield`组件有明显的边框,但通过添加特定的配置项和CSS样式,可以成功移除这些边框。 首先,让我们详细了解一下如何在ExtJs5中配置`...
在Ext JS这个强大的JavaScript框架中,开发者经常使用各种组件来构建富客户端应用,其中包括TextField(文本字段)和DatePicker(日期选择器)。有时,我们可能需要根据应用需求在运行时禁用这些组件的编辑功能,...
在设计用户界面时,为了提高用户体验,开发者常常会在TextField中添加警示效果,以提示用户输入的信息是否符合要求。这种警示效果通常通过颜色变化、图标显示或者文字提示来实现。例如,当用户输入的内容格式不正确...
需要注意的是,这个方法适用于非中文字符较少的情况,如果包含大量多字节字符(如日文、韩文等),可能需要采用更复杂的计算方式来精确控制字节数。同时,这种方法不考虑Unicode编码中的扩展字符,对于这些字符,...
在iOS开发中,`textField` 是一个非常常见的控件,用于接收用户输入的文字信息。在很多情况下,我们可能需要在用户交互时管理键盘的显示和隐藏,以优化用户体验。在这个"textField的一个简单例子"中,我们将探讨如何...
`Ext.form.TextField`是Ext JS库中的一个组件,用于创建基本的文本输入字段。它在Web应用程序中广泛用于收集用户输入的数据,如用户名、搜索关键词等。以下是对`Ext.form.TextField`的一些主要特性和配置选项的详细...
EXT 3.0中文API是EXT JavaScript库的一个重要版本,主要为Web应用程序提供丰富的用户界面组件和交互功能。EXT 3.0的API文档对于开发者来说是不可或缺的资源,它详细解释了各种类、方法、事件和配置选项,帮助开发者...
默认的length属性返回的是UTF-16编码下的字符数,这对于英文字符来说,每个字符对应一个UTF-16单元,但对于中文字符,每个汉字通常占用两个UTF-16单元。因此,当我们需要限制中文输入长度时,直接使用length属性可能...
Java中的`TextField`类是Swing库中的一个基础组件,用于创建用户可以在其上输入...在这个例子中,我们创建了一个30列的`TextField`,设置了初始文本,并将其添加到一个`JFrame`中。用户可以在此`TextField`中输入文本。
根据提供的文件信息,我们可以梳理出一系列与Ext框架相关的知识点,主要涵盖了Ext框架的基本用法、配置设置、Ajax请求处理以及自定义组件等几个方面。下面将详细解释这些知识点。 ### 1. Ext框架中的基本配置 ####...
在这个方法中,我们计算了当前文本的布局高度,并将结果应用到文本框的高度上。这样,当用户输入更多文本时,文本框会自动扩展以适应内容。 此外,如果你的故事板中有多个UITextField,可能需要处理它们之间的布局...
### Ext组件概述与初学者指南 #### 一、Ext组件概览 Ext是一个功能丰富的JavaScript框架,用于构建桌面级Web应用程序...对于初学者来说,逐步学习并实践每个组件的特性和用法,是成为一个合格的Ext开发者的关键步骤。
5. **可扩展性**:作为一个开源项目,`TextField-InputView`应该支持自定义扩展,开发者可以根据需求添加新的输入视图类型,或者修改已有的行为。 6. **兼容性**:考虑到兼容性问题,项目可能已经测试了在不同版本...
2. **占位符定制**:默认的占位符文本颜色较淡,如果希望更加突出,可以创建一个自定义`UILabel`作为占位符,并添加到`UITextField`的子视图中。 3. **字体与对齐方式**:通过`font`属性调整字体大小和类型,使用`...
2. `checkbox`:`Ext.form.Checkbox`是用于创建复选框的组件,用户可以选择或取消选择多个选项。 3. `combo`:`Ext.form.ComboBox`是下拉列表框组件,允许用户在预设的选项中进行选择,同时可以提供搜索功能以便...