Skip to content

Instantly share code, notes, and snippets.

Embed
What would you like to do?
ExtJS number field that allows for zero padding. Useful for displaying hours/minutes selectors.
Ext.define('p7_ui_static.view.field.PaddedNumber', {
extend: 'Ext.form.field.Number',
alias: 'widget.paddednumberfield',
/**
* @cfg {Number} zeroPadding
* Number of digits to pad
* Defaults to 2
*/
zeroPadding: 2,
initComponent: function(){
this.callParent();
},
/*
* @private
* Gets value from superclass
* TODO: Need to convert anything here? Hmm
*/
rawToValue: function(rawValue) {
var value = this.callParent([rawValue]);
return value;
},
/**
* @private
* Gets raw value from superclass then append zero padding
*/
valueToRaw: function(value) {
value = this.callParent([value]);
if(this.zeroPadding){
value = Ext.String.leftPad(value, this.zeroPadding, '0');
}
return value;
},
/**
* @private
* Gets submit value from superclass then removes zero padding
*/
getSubmitValue: function() {
var value = this.callParent();
if(this.zeroPadding && typeof(value) == 'string'){
value = value.replace(/^0+/g, '');
}
return value;
}
});
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment