扩展ExtJS numberfield支持千位分隔符(一)

在项目需求中,需要把金额数据


Ext.ux.NuberFiledFormat=Ext.extend(Ext.form.NumberField, {
baseChars: "0123456789,",
setValue: function(v){
v = typeof v == 'number' ? v : String(v).replace(this.decimalSeparator, ".").replace(/,/g, "");
v = isNaN(v) ? '' : rendererZhMoney(v);

//Ext.util.Format.number(this.fixPrecision(String(v)), "0,000,000.00");此为ext 4.0
this.setRawValue(v);
return Ext.form.NumberField.superclass.setValue.call(this, v);
},
/* getValue:function(){
//alert((String(Ext.form.NumberField.superclass.getValue.call(this)).replace(",","")));
return (String(Ext.form.NumberField.superclass.getValue.call(this)).replace(",",""));
},
*/
fixPrecision: function(value){
var nan = isNaN(value);
if (!this.allowDecimals || this.decimalPrecision == -1 || nan || !value) {
return nan ? '' : value;
}
return parseFloat(value).toFixed(this.decimalPrecision);
},
validateValue: function(value){
if (!Ext.form.NumberField.superclass.validateValue.call(this, value)) {
return false;
}
if (value.length < 1) { // if it's blank and textfield didn't flag it then it's valid
return true;
}
value = String(value).replace(this.decimalSeparator, ".").replace(/,/g, "");
if (isNaN(value)) {
this.markInvalid(String.format(this.nanText, value));
return false;
}
var num = this.parseValue(value);
if (num < this.minValue) {
this.markInvalid(String.format(this.minText, this.minValue));
return false;
}
if (num > this.maxValue) {
this.markInvalid(String.format(this.maxText, this.maxValue));
return false;
}
return true;
},
parseValue: function(value){
value = parseFloat(String(value).replace(this.decimalSeparator, ".").replace(/,/g, ""));
return isNaN(value) ? '' : value;
}
});
//注册扩展后的数字控件
Ext.reg('numberFieldFormat', Ext.ux.NuberFiledFormat);

注意:
上面代码中rendererZhMoney(v);js方法请参照

js 金额格式化
[url]http://913.iteye.com/blog/1638736
[/url]

-------------------------------------------------------------------------

使用示例

//在控件中指定xtype即可
xtype:"numberFieldFormat"


显示效果
[img]http://dl.iteye.com/upload/attachment/0072/6643/26f1c747-d591-38d5-85fb-98567eb049ef.png[/img]

好了,显示问题解决了,但在提交数据时,会把格式化后的数据提交,包含千分符,
关于处理提交问题,下一篇再讨论

你可能感兴趣的:(javascript)