Extjs (numberfield validate )

最新推荐文章于 2021-06-03 14:24:06 发布

youhan26

最新推荐文章于 2021-06-03 14:24:06 发布

阅读量4.9k

点赞数

分类专栏： ExtJs 文章标签： extjs numberfield

本文链接：https://blog.csdn.net/youhan26/article/details/39956547

版权

ExtJs 专栏收录该内容

21 篇文章 0 订阅

订阅专栏

numberfield validate :

allowDecimals: true,
decimalPrecision: 3,

可以自带三位小数

such as the number need (5.3)

the validate can use the regular expression

 validator: function(val) {
     if (!Ext.isEmpty(val)) {
        return true;
     } else {
         return "Value cannot be empty";
     }
   }

1、只能输入整数：
<ext:numberField ID ="nfd_Version" runat ="server" FieldLabel ="版本" AnchorHorizontal ="96%" DecimalPrecision ="0" >
属性:“DecimalPrecision” 是小数位数的设定，默认是2，为0意思就是小数位数0位，也是就整数了。
2、只能输入正数：
<ext:numberField ID ="nfd_Version" runat ="server" FieldLabel ="版本" AnchorHorizontal ="96%" AllowNegative ="false" >
属性：AllowNegative 是否允许负数 默认为true。
3、只能输入正整数 就是把前两点的属性结合就是了
<ext:numberField ID ="nfd_Version" runat ="server" FieldLabel ="版本" AnchorHorizontal ="96%" DecimalPrecision ="0" AllowNegative ="false">
4、限制输入不是数字时为空
 
 
  
  
   
   <FONT color=black><ext:numberField ID ="nfd_Version" runat ="server" FieldLabel ="版本" AnchorHorizontal ="96%" DecimalPrecision ="0" AllowNegative ="false" MinValue ="1">
<Listeners>
<Invalid Handler ="nfd_Version.setValue('');" />
</Listeners>
</ext:numberField></FONT>
  
  
  
  复制代码
 
 
这个例子限制了只能输入大于1的整数，那么如果你输入了aa，就自动变为空值。
5.关于显示小数点后面的0   比如 限制为3位小数  数字为7 但是页面的显示总是7 理想的是要7.000 
将下面的代码拷贝到javascript中就可
 
 
  
  
   
   //NumberField控件的值小數部份不忽略0 比如 值為5 顯示為5.0
Ext.override(Ext.form.NumberField, {
setValue: function(v) {

v = typeof v == 'number' ? v : parseFloat(String(v).replace(this.decimalSeparator, "."));
v = isNaN(v) ? '' : v.toFixed(this.decimalPrecision).replace(".", this.decimalSeparator);
return Ext.form.NumberField.superclass.setValue.call(this, v);
}
});
  
  
  
  复制代码
 
 
注意：该方法会把页面中所有的控件的小数位为0的根据控件的小数位数显示 


以下是NumberField控件的属性：

 
 
  
  
  
  
   
   
    
    fieldClass: 表单元素一般状态CSS样式（默认为"x-form-field"）。
allowDecimals: 值为 False时将不接受十进制值 (默认为true)
decimalSeparator: 设置十进制数分割符(默认为 '.')
decimalPrecision:设置小数点后最大精确位数(默认为 2)
allowNegative: 值为 False时只允许为正数(默认为 true，即默认允许为负数)。
minValue: 允许的最小值(默认为Number.NEGATIVE_INFINITY)
maxValue: 允许的最大值(默认为Number.MAX_VALUE)
minText: 最小值验证失败（ps：超出设置的最小值范围）时显示该错误信息（默认为{ minValue }）
maxText:最大值验证失败（ps：超出设置的最大值范围）时显示该错误信息(默认为{ maxValue }）
nanText:当值非数字时显示此错误信息。例如，如果仅仅合法字符如'.' 或 '-'而没有其他任何数字出现在该域时，会显示该错误信息。(默认为"{value}）
baseChars：接受有效数字的一组基础字符（默认为0123456789）
vtypeText：在当前字段的vtype中，制定一个错误信息代替默认的（默认为null）。如vtype不设置该项就无效。
stripCharsRe：一个JavaScript正则表达式，用于在进行验证该动作之前抽离不需要的内容（默认为null）。
grow : 当值为 true 时表示字段可以根据内容自动伸缩
growMin : 当 grow = true 时允许的字段最小宽度（默认为 30）
growMax : 当 grow = true 时允许的字段最大宽度(默认为 800)
vtype：Ext.form.VTypes中定义的效验类型名(默认为 null)
maskRe：一个用来过滤无效按键的正则表达式(默认为 null)
disableKeyFilter : 值为 true 时禁用输入按键过滤(默认为 false)
allowBlank：值为 false 时将效验输入字符个数大于0(默认为 true)
minLength：输入字段所需的最小字符数(默认为 0) 
maxlength: 输入字段允许的最大字符数(默认为 Number.MAX_VALUE)
minLengthText：输入字符数小于最小字符数时显示的文本（默认为{minLength}")
maxLengthText :输入字符数小于最小字符数时显示的文本（默认为{maxLength}"）
selectOnFocus: 值为 ture 时表示字段获取焦点时自动选择字段既有文本(默认为 false)
blankText: 当允许为空效验失败时显示的错误文本（默认为"This field is required"）
validator: 字段效验时调用的自定义的效验函数(默认为 null)。如果启用此项，则此函数将在所有基础效验（allowBlank、minLength、maxLength和任意的vtype）成功之后被调用，调用函数时传递的参数为该字段的值。且此函数的有效返回应为成功时返回 true，失败时返回错误文本。
Regex: 一个用以在效验时使用的 JavaScript 正则表达式对象(默认为 null)。如果启用此项，则此正则表达式将在所有基础效验成功之后被执行，执行此正则表达式时传递的参数为该字段的值。如果效验失败，则根据regexText的设置将字段标记为无效
regexText: 当regex被设置且效验失败时显示的错误文本(默认为 "")。
emptyText: 空字段中显示的文本(默认为 null)。注意，只要这个字段是被激活的而且name属性是有被指定的，那么也会发送到服务端。
emptyClass: emptyText使用的CSS样式类名(默认为 'x-form-empty-field')。此类的添加与移除均由当前字段是否有值来自动处理
enableKeyEvents: True表示，为HTML的input输入字段激活键盘事件的代理（默认为false）
fieldLabel: 在组件旁边那里显示的label文本（默认为''）。
inputType: input字段的type属性，诸如 radio、text、password、file等的元素都有type属性。属性是“file”与“怕ssword”就要在这里设置了，因为当前Ext并没有这些单独的组件。注意当你使用inputType:'file'时，emptyText就避免使用。
tabIndex: 字段的tabIndex。注意这只对已渲染的元素有效，applyTo的那些无效（默认为undfined）
value: 字段初始化的值（默认为undefined）