`
fordream
  • 浏览: 63465 次
  • 性别: Icon_minigender_1
  • 来自: 深圳
社区版块
存档分类
最新评论

Ext TextField默认提示信息,并支持中文按2个字节计算

阅读更多

   修改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;
                }
        }
});

 

1
1
分享到:
评论
2 楼 chenzi 2014-11-20  
value instaceof String应该是instanceof 没有看懂
1 楼 henchong 2013-01-15  
value instaceof String应该是instanceof  具体看不懂这个有什么作用

相关推荐

    ext-3-TextField-sample.rar_ext_ext TextField_ext textfield inp

    在提供的压缩包中,"ext-3-TextField-sample.rar" 涉及到的是ExtJS 3.x版本中的TextField组件,这是一个基本的用户输入控件,常用于收集用户在网页上的文本信息。这个示例着重介绍了如何创建和使用TextField。 ...

    Ext表单组件之textField

    在Web开发领域,Ext JS是一个强大的JavaScript库,用于构建数据驱动的富客户端应用程序。它提供了丰富的用户界面组件,包括各种表单元素。本篇我们主要关注"Ext表单组件之textField",它是最基础也是最常用的输入...

    EXT表单验证之TextField

    EXT中的TextField支持多种vtype验证类型,这些类型提供了基础的数据验证功能,帮助开发者构建健壮的前端表单。以下是一些常见的EXT TextField vtype验证类型及其详解: 1. **email**:验证输入是否为有效的电子邮件...

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

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

    ExtJs5 去掉textfield边框

    在给定的描述中,我们看到开发者遇到了一个问题:默认情况下,ExtJs5的`textfield`组件有明显的边框,但通过添加特定的配置项和CSS样式,可以成功移除这些边框。 首先,让我们详细了解一下如何在ExtJs5中配置`...

    Ext Extjs 禁止文本和日期编辑

    在Ext JS这个强大的JavaScript框架中,开发者经常使用各种组件来构建富客户端应用,其中包括TextField(文本字段)和DatePicker(日期选择器)。有时,我们可能需要根据应用需求在运行时禁用这些组件的编辑功能,...

    带警示效果的TextField、改变光标起始位置

    在设计用户界面时,为了提高用户体验,开发者常常会在TextField中添加警示效果,以提示用户输入的信息是否符合要求。这种警示效果通常通过颜色变化、图标显示或者文字提示来实现。例如,当用户输入的内容格式不正确...

    IOS textField限制字节长度

    需要注意的是,这个方法适用于非中文字符较少的情况,如果包含大量多字节字符(如日文、韩文等),可能需要采用更复杂的计算方式来精确控制字节数。同时,这种方法不考虑Unicode编码中的扩展字符,对于这些字符,...

    textField的一个简单例子

    在iOS开发中,`textField` 是一个非常常见的控件,用于接收用户输入的文字信息。在很多情况下,我们可能需要在用户交互时管理键盘的显示和隐藏,以优化用户体验。在这个"textField的一个简单例子"中,我们将探讨如何...

    Ext.form.TextField最简单的用法.docx

    `Ext.form.TextField`是Ext JS库中的一个组件,用于创建基本的文本输入字段。它在Web应用程序中广泛用于收集用户输入的数据,如用户名、搜索关键词等。以下是对`Ext.form.TextField`的一些主要特性和配置选项的详细...

    ext 3.0中文API

    EXT 3.0中文API是EXT JavaScript库的一个重要版本,主要为Web应用程序提供丰富的用户界面组件和交互功能。EXT 3.0的API文档对于开发者来说是不可或缺的资源,它详细解释了各种类、方法、事件和配置选项,帮助开发者...

    一行代码解决textField输入中文长度限制

    默认的length属性返回的是UTF-16编码下的字符数,这对于英文字符来说,每个字符对应一个UTF-16单元,但对于中文字符,每个汉字通常占用两个UTF-16单元。因此,当我们需要限制中文输入长度时,直接使用length属性可能...

    Java中TextField类.pdf

    Java中的`TextField`类是Swing库中的一个基础组件,用于创建用户可以在其上输入...在这个例子中,我们创建了一个30列的`TextField`,设置了初始文本,并将其添加到一个`JFrame`中。用户可以在此`TextField`中输入文本。

    ext常用注释

    根据提供的文件信息,我们可以梳理出一系列与Ext框架相关的知识点,主要涵盖了Ext框架的基本用法、配置设置、Ajax请求处理以及自定义组件等几个方面。下面将详细解释这些知识点。 ### 1. Ext框架中的基本配置 ####...

    ios keywoard自适应textField高度

    在这个方法中,我们计算了当前文本的布局高度,并将结果应用到文本框的高度上。这样,当用户输入更多文本时,文本框会自动扩展以适应内容。 此外,如果你的故事板中有多个UITextField,可能需要处理它们之间的布局...

    Ext组件说明 Ext组件概述

    ### Ext组件概述与初学者指南 #### 一、Ext组件概览 Ext是一个功能丰富的JavaScript框架,用于构建桌面级Web应用程序...对于初学者来说,逐步学习并实践每个组件的特性和用法,是成为一个合格的Ext开发者的关键步骤。

    TextField-InputView, UITextField InputView模式:终结注册类、信息采集类.zip

    5. **可扩展性**:作为一个开源项目,`TextField-InputView`应该支持自定义扩展,开发者可以根据需求添加新的输入视图类型,或者修改已有的行为。 6. **兼容性**:考虑到兼容性问题,项目可能已经测试了在不同版本...

    自定义textfield

    2. **占位符定制**:默认的占位符文本颜色较淡,如果希望更加突出,可以创建一个自定义`UILabel`作为占位符,并添加到`UITextField`的子视图中。 3. **字体与对齐方式**:通过`font`属性调整字体大小和类型,使用`...

    EXT.form组件

    2. `checkbox`:`Ext.form.Checkbox`是用于创建复选框的组件,用户可以选择或取消选择多个选项。 3. `combo`:`Ext.form.ComboBox`是下拉列表框组件,允许用户在预设的选项中进行选择,同时可以提供搜索功能以便...

Global site tag (gtag.js) - Google Analytics