PDA

View Full Version : number fomat (EU style) in combo box doesn't work as expected



IT100
8 Nov 2014, 7:22 PM
I predefined a numberfield format because I want my numbers to appear as "1.000.000,00" (EU style) this works in a normal number field, but doesn't in a combo box:



if (Ext.util && Ext.util.Format) {

Ext.apply(Ext.util.Format, {
thousandSeparator: '.',
decimalSeparator: ',',
currencySign: '\u20ac',
// Dutch Euro
dateFormat: 'j-m-Y'
});
}

The numberfields work just fine, but the combobox in the grid grid only accepts us style numbers:
Changing

numberRenderer('0,000.00') to numberRenderer('0.000,00') doesn't work also.



{
header: 'Price',
dataIndex: 'price',
align: 'right',
renderer: Ext.util.Format.numberRenderer('0,000.00'),
flex: 2,
editor: {
xtype: 'numberfield'
}
},
{
header: 'Marge %',
dataIndex: 'margin',
align: 'right',
flex: 2,
renderer: Ext.util.Format.numberRenderer('0,000.00'),
// connect combo to store
editor: new Ext.form.field.ComboBox({
typeAhead: true,
triggerAction: 'all',
store: 'ProductMargins',
displayField: 'margin',
valueField: 'margin',
xtype: 'numberfield'
})
},

I'm stuck, could this be a bug?
please help.

slemmon
10 Nov 2014, 2:58 PM
Hi,

I'm not totally sure I'm following you. I used the columns snippet along with your number format of '0.000,00' in the fiddle below and they appear to render in the cell with the provided format. Can you fork this fiddle and elaborate on what might be missing from it or further steps that need to be taken to match up with what you're seeing?

d4f

100-IT
10 Nov 2014, 3:29 PM
thanks for your nice example:

When I use "." in your store data example it does work but then
how come I get 2.000.000,5000 in the field when Ext.util.Format.numberRenderer('0.000,00') is set to show only 2 decimals?

See updated example:


Ext.application({
name: 'Fiddle',


launch: function() {

Ext.apply(Ext.util.Format, {
thousandSeparator: '.',
decimalSeparator: ',',
currencySign: '\u20ac',
// Dutch Euro
dateFormat: 'j-m-Y'
});


Ext.widget('gridpanel', {
renderTo: document.body,
height: 300,
width: 300,
plugins: 'cellediting',
store: {
fields: ['price', 'margin'],
data: [{
price: 2000000.50,
margin: 20.85
}]
},
columns: [{
header: 'Price',
dataIndex: 'price',
align: 'right',
renderer: Ext.util.Format.numberRenderer('0.000,00'),
flex: 2,
editor: {
xtype: 'numberfield'
}
}, {
header: 'Marge %',
dataIndex: 'margin',
align: 'right',
flex: 2,
renderer: Ext.util.Format.numberRenderer('0.000,00'),
// connect combo to store
editor: new Ext.form.field.ComboBox({
typeAhead: true,
triggerAction: 'all',
store: {
fields: ['margin']
},
displayField: 'margin',
valueField: 'margin'//,
//xtype: 'numberfield'
})
}]
});
}
});

slemmon
10 Nov 2014, 3:56 PM
Hi,

I'm afraid I led you astray just a bit. You'll actually maintain the format in the numberRenderer like "0,000.00" and you'll need to set the Ext.util.Format properties of decimalSeparator and thousandSeparator like the below example:

d4n

100-IT
12 Nov 2014, 10:06 AM
I thought your example solved my issues yet:

When someone enters decimals they expect to use a comma not a dot when entering decimal numbers ( In Europe) - this doesn't work in the combobox - try 123,45 and you get a blank field.
Try using your fiddle example.

slemmon
12 Nov 2014, 12:53 PM
Are you using a locale override file (or locale required in your app's app.json file if this is a Cmd-built app)? If so, that should set the decimal separator for numberfield.

In the Fiddle below I'm including the French local numberfield override for demonstration purposes:

d9h

100-IT
12 Nov 2014, 1:20 PM
yes and its a cmd build version.


If I try your latest Fiddle example I still can't enter a comma in the combobox, I still get a blank field, numberfield works fine.

IT100
13 Nov 2014, 6:30 PM
should I file this as a bug?

:-/

slemmon
14 Nov 2014, 12:27 PM
The combobox doesn't contain the same number-specific logic that the numberfield has for handling decimal and thousand separator. You'd need to extend combobox and add that functionality from numberfield to your derived class.

100-IT
15 Nov 2014, 11:52 AM
yea, I kinda guessed this would be the case - this should be out of the box though - as its a general usage. When one is willing to support international accepted standards.