Ext.application({
name: 'Fiddle',
launch: function () {
console.log('start.');
Ext.define('User', {
extend: 'Ext.data.Model',
fields: [{
name: 'phone',
type: 'auto'
}],
});
var panel = Ext.create('Ext.form.Panel', {
fullscreen: true,
focusable: false,
items: [{
xtype: 'fieldset',
title: '通貨フィールドSample(日本円)',
items: [{
xtype: 'currency-field',
label: '金額',
}]
}]
});
}
});
Ext.define('Ext.ux.field.CurrencyField', {
extend: 'Ext.field.Text',
xtype: 'currency-field',
textAlign: 'right',
statics: {
PREFIX : '￥'
},
initialize: function() {
this.callParent(arguments);
},
/**
* カンマと￥を除去して値を取得
*/
getValue : function() {
var str = String(this.callSuper());
if (str) {
var num = parseFloat(str.replace(/[^\d\.-]/g,''));
num = isNaN(num) ? '' : num
return num;
}
return '';
},
/**
* フォーカスを失った時にカンマと￥を付与
*/
onBlur : function(obj, e, eOpts ) {
var str = String(this.getValue());
var tmp = Ext.util.Format.number(str, '0,000');
if (tmp !== '') {
var tmp = this.self.PREFIX + tmp;
}
this.setValue(tmp);
return this.callSuper(arguments);
},
/**
* フォーカスを得た時にカンマと￥を除去
*/
onFocus: function (obj, e, eOpts) {
this.setValue(this.getValue());
return this.callSuper(arguments);
}
});
以下にデモ＆ソースがあるので参考にしてみて下さい。
デモ＆ソース
デモ＆ソース
