ExtJs textfield/numberfield에 입력 된 내용을 제한하십시오.

Question

textfield/numberfield 현재는 0 to 99999.99 사이의 값, 즉 소수점 2 자리 5 자리 만 허용해야한다는 요구 사항이 있습니다.

사용자는 잘못된 번호를 사용하도록 제한해야합니다.

정규식이 좋지 않지만 문제가 해결됩니까? 이 문제를 해결하기위한 모든 포인터가 제공됩니다.

사용자에게 5 자리를 초과하는 값을 입력하도록 제한해야합니다. 5 자리 숫자 다음에 소수 자릿수를 넣을 수 있고 2 자리 숫자를 초과 할 수 있습니다.

제안 사항?

Answer 1

Ext.create('Ext.form.Panel', { 
title: 'On The Wall', 
width: 300, 
bodyPadding: 10, 
renderTo: Ext.getBody(), 
items: [{ 
    xtype: 'numberfield', 
    anchor: '100%', 
    name: 'bottles', 
    fieldLabel: 'Bottles of Beer', 
    value: 0, 
    maxValue: 99999.99, 
    minValue: 0 
}], 
buttons: [{ 
    text: 'Take one down, pass it around', 
    handler: function() { 
     this.up('form').down('[name=bottles]').spinDown(); 
    } 
}] 

});
출처 : http://docs-origin.sencha.com/extjs/4.0.7/#!/api/Ext.form.field.Number

Answer 2

사용자 지정 유효성 검사 유형 VTypes을 추가해야합니다.

addCustomVtypes : function() { 
    var mRegex = /^\d{0,5}(\.\d{0,2})?$/; 

    Ext.apply(Ext.form.field.VTypes, { 
     mRegex : function(val, field) { 
      return ralphaNumHyphen.test(val); 
     }, 
     mRegexText : 'Invalid input. Message here.', 
     mRegexMask : /\d{0,5}(\.\d{0,2})?$/i 
    }); 
} 

애플리케이션 실행시이를 호출 할 수 있습니다.

그런 다음 텍스트 필드에 vtype: mRegex을 추가하십시오.