Regex 是否使用正则表达式限制textfield/numberfield中的输入字符？

我在ExtJS表单中使用numberField，只想输入0-99范围内的正数，它应该只接受2个字符（不超过2个）

在上述代码中给出错误，但它接受的字符数超过2个

我也尝试了以下方法，但问题是相同的：

{
    xtype:"textfield",
    regex: /^\d{0,2}$/,
    regexText: "<b>Error</b></br>Invalid Number entered.",
    validator: function(v) {
        return /^\d{0,2}$/.test(v)?true:"Invalid Number";
    }
}

{
xtype:“textfield”，
正则表达式：/^\d{0,2}$/,，
regexText:“错误
输入的数字无效。”，
验证器：函数（v）{
return/^\d{0,2}$/.test（v）？true：“无效数字”；
}
}

---

如何限制输入超过2个字符？

如果您使用的是版本3，

maxLength

文档描述了如何使用

autoCreate

属性来声明最大长度（文档示例显示了一个NumberField，但TextField类也支持它）：

maxLength:数字验证允许的最大输入字段长度 （默认为Number.MAX_值）。此行为旨在提供 通过改进可用性以允许粘贴，向用户提供即时反馈 以及编辑或改写和回溯。限制最大限度 使用“自动创建”可输入到字段中的字符数 要向字段添加任何属性，例如：

使用版本4，TextField具有该属性

---

如果设置为使用正则表达式，两个版本都支持

maskRe

属性，尽管我认为这不能防止粘贴无效值。

不确定在ExtJS 4.x之前是否存在vtype，但这就是使用vtype的方法

var validMileRadius = /^([0-9]{1,4})/;
        Ext.apply(Ext.form.field.VTypes, {
            //  vtype validation function
            radius: function(val, field) {
                return validMileRadius.test(val);
            },
        radiusText: 'Not a Valid Radius.'
    });

{
    xtype: 'textfield',
    width: 40,
    maxLength : 4,
    style : {marginLeft:'10px'},
    id : 'cityRadius',
    enforceMaxLength :4,
    vtype : 'radius'                    
}

谢谢

---

普尼思

为所有坚持同一立场的人

对于ExtJS4.x，甚至不需要创建VType。从

Ext.form.field.Number

的ExtJS 4.x文档中：

enforceMaxLength : Boolean
True to set the maxLength property on the underlying input field. Defaults to false

因此，您只需指定maxLength并将enforceMaxLength设置为true。根据之前的帖子，可能是这样的：

{
  xtype: 'textfield',
  width: 40,
  maxLength : 4,,
  enforceMaxLength : true  
  style : {marginLeft:'10px'},
  id : 'cityRadius'                
}

---

只是一个助手，但要将文本字段限制为只允许数字，可以使用属性“maskRe”设置文本字段的属性。它允许您使用正则表达式创建掩码。这是一个仅允许您输入数字的掩码：

{
    xtype: 'textfield',
    fieldLabel: 'Text Field(numbers-only)',
    enforceMaxLength:true,  //Restrict typing past maxLength: n
    maxLength: 8,           //Set max length validation
    maskRe:/[0-9.]/         //Allow only numbers
},

---

为了动态设置maxLength，我提出了以下覆盖：

Ext.override(Ext.form.field.Number, {
  /**
   * Setter: this method will set the maxLength variable on our NumberField
   * class, and on its actual dom element, so we can actually restrict the user
   * from entering over the maxLength
   * @param {Number} maxLength
   */
  setMaxLength: function(maxLength) {
    this.maxLength = maxLength;
    var inputEl = this.inputEl;
    if (inputEl) {
      var domEl = inputEl.dom;
      if (domEl) {
        domEl.maxLength = maxLength;
      }
    }
  },

  /**
   * Shortcut method for setting the maxLength based on the maxValue... if
   * maxValue is not set, then 0 is used, which means the maxLength will be 1
   */
  setMaxLengthFromMaxValue: function() {
    var maxValue = this.maxValue || 0;
    if (maxValue >= 0) {
      this.setMaxLength(maxValue.toString().length);
    }
  }
});

---

使用maskre config来限制textfield非常简单。 if将允许您只输入数字和字母

    xtype: 'textfield',
    fieldLabel: 'Text Field(numbers-only)',
    enforceMaxLength:true,
    maxLength: 8,
    maskRe: /[A-Za-z0-9]/

---

谢谢你，伙计，我也用另一个+1来打开一个新功能。自从它发行以来，我一直在努力学习4的所有细节，男孩有很多。干杯。这完全是个笑话，我们必须用谷歌搜索如何在EXT中设置maxLength（一个HTML简单属性）。这个框架是个笑话。没错，这是个笑话，但它也有不同的语法。但这并不好，我们应该使用不同的语法。

maxLength: 2,
enforceMaxLength: true,

Ext.override(Ext.form.field.Number, {
  /**
   * Setter: this method will set the maxLength variable on our NumberField
   * class, and on its actual dom element, so we can actually restrict the user
   * from entering over the maxLength
   * @param {Number} maxLength
   */
  setMaxLength: function(maxLength) {
    this.maxLength = maxLength;
    var inputEl = this.inputEl;
    if (inputEl) {
      var domEl = inputEl.dom;
      if (domEl) {
        domEl.maxLength = maxLength;
      }
    }
  },

  /**
   * Shortcut method for setting the maxLength based on the maxValue... if
   * maxValue is not set, then 0 is used, which means the maxLength will be 1
   */
  setMaxLengthFromMaxValue: function() {
    var maxValue = this.maxValue || 0;
    if (maxValue >= 0) {
      this.setMaxLength(maxValue.toString().length);
    }
  }
});

    xtype: 'textfield',
    fieldLabel: 'Text Field(numbers-only)',
    enforceMaxLength:true,
    maxLength: 8,
    maskRe: /[A-Za-z0-9]/